Question : Advanced Facebook Fan Page Formatting

I have a website that contains a video and some forms for opting in to the service, and I'm trying my best to create a Facebook Fan Page that gives all the functionality of the original page. (http://www.ez-webmaker.com/elysium/template3a.html)

untitled.PNG (205 KB) (File Type Details)
Simple layout

I just don't know the first thing about developing Fan Pages with advanced features like this. Can anyone lend some direction?

Alain

Answer : Advanced Facebook Fan Page Formatting

It's actually as simple as wanting to completely embed the content of that page into a facebook page. The client is obsessed with medium. They expect that since facebook is a popular site, their content would get seen more as a facebook fan page than a standalone website.

In any event, the FBML solution pretty much solved my problem. HTML can be used almost ad verbatim in the FBML add-on, so all that's needed is to change the flash video to use Facebook's flash player (<fb:flv src='http://clubseabreeze.s3.amazonaws.com/5b.flv' width='550' height='300' title='my movie' color='#FFBB00' salign='r' scale='showall'/>) and adjust the url's for form submission and images in the html to their full length paths from the original site.

The result, impressively enough, is more or less an exact duplicate of the original page!

--
Alain

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:



<div align="center">
&nbsp;<table border="0" width="818" height="465" cellspacing="0" cellpadding="3">
  <tr>
   <td background="http://www.ez-webmaker.com/templates/images/header-4.gif" style="border-bottom-style: solid; border-bottom-width: 1px">

   <div id="subHeadline">
    <h2 align="center">
    <font face="Calibri" style="font-size: 16pt" color="#800000">
    Don't Be A Part Of This 'So-Called' Recession... Take Control 
    Now...</font></h2>
   </div>
   <div id="Headline">
    <h1 align="center"><font face="Calibri" style="font-size: 28pt">
    Free Videos Reveal Details On How <br>

    You Can Control Your Financial 
    Future!</font>&nbsp;<fb:flv src='http://clubseabreeze.s3.amazonaws.com/5b.flv' width='550' height='300' title='my movie' color='#FFBB00' salign='r' img='http://img19.imageshack.us/img19/2527/10656468.png' scale='showall'/></h1></div>
   </td>
  </tr>
 </table>
</div>
<div align="center">
 <table border="0" width="818" cellspacing="0" cellpadding="8">
  <tr>
   <td bgcolor="#D9D9D9">

   <div id="CTAHeadline">
    <h1 align="center"><font face="Calibri">Get All The Details Now 
    For Free!<br>
    <font size="5">Enter in Your Information Below.</font></font></h1>
    <div align="center">
     <table border="0" width="25%">
      <tr>
       <td>
       <FORM action="http://www.ez-webmaker.com/cgi-bin/ar/replicator-4.cgi" method="post">

                                 <INPUT type="hidden" name="SponsorID" value="elysium">
                                    <INPUT TYPE="hidden" NAME="emailstart" VALUE="0">
            <INPUT TYPE="hidden" NAME="timer" VALUE="1"> 
            <INPUT TYPE="hidden" NAME="autonumber" value="0">
            <INPUT TYPE="hidden" NAME="fax" size="50">
                                     <P>
                                     <table border="0" cellspacing="0" cellpadding="0">
                                     <tr><td valign="top">
                                     <b>

                                     <font face="Calibri" color="#FFFFFF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font face="Calibri" color="#800000">&nbsp;Name:</font></b><font face="Calibri" color="#800000"> </font>
                                     <font face="Calibri" color="#FFFFFF">&nbsp;&nbsp;&nbsp;&nbsp;</font>
                                     </td><td>
                                     <INPUT NAME="firstname" size="21"><br /><br />
                                     </td></tr>
           
                                     <tr><td valign="top">
             <font face="Calibri" color="#FFFFFF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font face="Calibri" color="#800000"><b>E-Mail:</b>&nbsp;</font><font face="Calibri" color="#FFFFFF">&nbsp;             </font>

                                     </td><td>
             <INPUT NAME="email" size="21"><br /><br />
                                     </td></tr>
            
                                     <tr><td valign="top">
          <font face="Calibri" color="#FFFFFF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font face="Calibri" color="#800000"><b>Phone:</b>&nbsp;&nbsp;</font><font face="Calibri" color="#FFFFFF">                                     </font>
                                     </td><td>
             <INPUT NAME="phone" size="21">
                                     </td></tr></table>

             <P style="padding-left:100px;">
          <INPUT TYPE=submit VALUE="Give Me The Details!" >
             
          <P>
          <input type="hidden" name="redirect" value="ez-webmaker.com/template3b.html">
         </FORM></td>
      </tr>
     </table>
     <p><font face="Harlow Solid Italic">* Your information will 
     not be spammed, rented or sold - we respect your privacy.&nbsp;

     </font>
    </div>
   </div>
   <p>&nbsp;</td>
  </tr>
 </table>
</div>

done.PNG (40 KB) (File Type Details)

Surprisingly easy.