How To Create FBML code for your Facebook Pages

Posted by Ellen Agius in Social Marketing |

How To Create FBML code for your Facebook Pages

A Warm Hello from Australia! If you are new here and want to know more about how to build a 6 figure income, you might want to grab the RSS feed for updates on this topic. I post regularly about How To Market For 6 Figures.

Buffer

How To Create FBML Code for your Facebook Pages that is the question??

or at least it was my question

if you are like me here are some easy answers to help you set up a opt in code on your pages

Step 1 – Create your Facebook Fan Page
Go to facebook.com/pages/create.php or click on pages at your personal facebook profile
Select a category and name for your page and click the button.

Step 2 – Add Static FBML to your Fan Page
Do a Search in the tool bar for Static FBML and select the one that says application..and allow and add to your page.

Step 3 - Edit the FBML
Go back to your fanpage…you can find it at your Facebook profile under pages or do a search for it by name in the tool bar.

Once on your fan page click on Edit Settings link and scroll down to find FBML and click edit

At the top enter your title eg.. Start Here, Free Training etc to describe the content you are sending your fans to.

For the box labeled FBML: you enter FBML code..see FBML code ideas below

Step 4 – Adding your new FBML Tab
Click the name tabs at the top of your Page and click the + sign to find your new tab eg..Start here, Free Training…and you can drag it accross so it can be viewed.

Step 5 – Make sure your FBML tab is set as the default landing page
Go back to Edit Page and application Settings for the Static FBML application. Scroll up and click on wall settings and edit and for the default landing tab option select the FBML tab name you created from the list.

Here is some FBML Code you can use to create your page

To insert a picture so that it is linked to a website:

<a href=”http://www.websitelink.com” target=”_blank”><img src=”http://picturelink.jpg” alt=”whatever this is a picture of including a keyword or two” border=”0?></a>

Easy Way To Get Your Image URL Watch Here….

VIDEO PLAYER
<div style=”position:absolute; right:168px; top:410px; color : #cc0000;”> <fb:swf swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;” swfsrc=’http://www.youtube.com/……(youtubesharecode)’ imgsrc=’http://www.(photolink)’ width=’425′ height=”280″/>

TWITTER BUTTON
<div style=”position:absolute; right:175px; top:-185px; color : #cc0000;”><a href=”http://www.twitter.com/(yourtwittername)”><img src=”http://i47.tinypic.com/m8mrmf.jpg” width=”60″ height=”60″ border=”0″target=”_blank” /></a>
<BR/>

YOUTUBE BUTTON
<div style=”position:relative; right:-85px; top:-62px; color : #cc0000;”>
<a href=”http://www.youtube.com/user/(youryoutubename)”><img src=”http://i45.tinypic.com/2e1yn2q.jpg” width=”60″ height=”60″ border=”0″ target=”_blank” /></a>
<BR/>

FACEBOOK BUTTON
<div style=”position:relative; right:-85px; top:-62px; color : #cc0000;”>
<a href=”http://www.facebook.com/(yourfacebookname)”><img src=”http://i47.tinypic.com/10ckymc.jpg” width=”60″ height=”60″ border=”0″ target=”_blank” /></a>

To make a word clickable to another website:

<A title=”whatever the name of the linked page is” HREF=”http://www.whateverwhatever.com”>word you want clickable</A>

To insert a picture:

To skip down to the next line:
<BR>

To skip a whole line between items:
<P>

To center something:
<CENTER>whatever whatever</CENTER>

To make words BOLD:
<B>whatever word you want bold</B>

To make words ITALIC:
<I>whatever word you want italicized</I> (that is the capital letter “i“)

To change the font size

<font size=”3?>whatever word(s) you want larger</font>

Facebook now has a limit of 520 pixels for any images/tables on a custom tab, so if you have trouble loading something make sure it is sized less than 520 pixels.

Picnik.com is also a great free image editor you can use…

Here is a free tool that has also helped me..although the generate code link is not functional you can use the code and cut and paste in your own details in the necessary areas…

Fanpage Generator

So there you have it…some tools to help you create a awesome fan page..

Please share this information with others if you found it useful…tweet tweet

Have a great day

Trackbacks

5 Responses to “How To Create FBML code for your Facebook Pages”

Kelly Suchey says:
November 20, 2010 at 9:05 pm
Wow Ellen. This is great information.
reply
Aaron says:
November 24, 2010 at 8:26 am
Terrific Post! I am really into social media right now (like everyone else out there!), especially Facebook Marketing and FBML. It can be hard to keep up to date with such a fast changing innovative topic but I manage to do it through the fan page factory (http://facebook.com/thefanpagefactory) and blog posts exactly like yours. Tips and tricks rock. I am trying to learn as much as possible to put myself ahead of the curve. So thank you again!
Enjoy!
Aaron
reply
Yairo says:
February 14, 2011 at 6:07 pm
Hey guys, the new FBML Editor is out! Free demo download avilable, have fun:
http://www.facebook.com/pages/FBML-Editor/197835840233509
reply
Lallie says:
August 29, 2011 at 2:28 pm
Hi, Ms. ellen, I’m having a problem with myfbml code. Actually, I wasn’t the one one who made it, I just downloaded it form mediafire then I’ll just change the contents like images, font colors and URLs… Now, I do not know why my comment box isn’t working.. There is a comment box, but no one can post any comment to it… What should I do… I’m no expert when it comes to fbml.. Thank you and I hope you can help me with my problem…
reply
- Ellen Agius says:
  September 1, 2011 at 4:37 pm
  Hi lallie the fbml code guidelines may have changed in facebook, check the setup details there are also some great sites if you do a search which show you fbml code
  cheers Ellen
  reply