Facebook Tabs Made Easy (kind of) With FBML

By Angie Martin (@angieLmartin)

Do you or one of your clients have a Facebook Fan Page? Think it’s kind of boring and want to spice things up a little?  There are a ton of Facebook applications out there to help you create original content – as seen by our Tool Time post on Involver last week, but to get really creative you are going to need to take a stab at Static FBML.  

With the FBML application, users can add newly created tabs to their Facebook Fan Pages by using CSS, HTML and Facebook’s mark-up code, FBML.  It seems kind of tricky at first glance, but Facebook has done a good job of making sure there are plenty of simple options out there to get you started with (I included a few links to helpful sites below).  Just a few things to note before beginning:

  • Static FBML can only be added to Facebook Fan Pages
  • You can’t auto-run JavaScript in an FBML page – it must require an actual user action
  • In order to add applications to the Fan Page, you must be an Administrator

Ready to get started? Here are five quick steps to adding Static FBML to your Fan Page:

  • Click “Edit Page” under your Fan Page’s large avatar image
  • Under “Applications,” under “More Applications” click the pencil/edit icon and select “Browse more”
  • Under “All Applications” in the left column, enter “static fbml” (without quotes) into the search field
  • Go to the Static FBML application from the search results page (it should be the only result)
  • Click “Add to my Page” in the left column

Once you have the FBML tab added, it’s time to get coding! Usually, something like this…

… will make most people cringe, but if you take it in small steps and don’t try anything crazy, it’s really not bad.   Even a non-tech wizard like me was able to create a pretty simple “News” tab on a practice Fan Page.

Pros:

A great tool for creating Fan Pages that stand out from the crowd with specialty tabs that highlight the group or company’s best assets.

Cons:

You need to be sufficiently skilled with HTML and FBML code to make a really creative page that is worth your time.  To even create a basic page like I did, it’s going to require some time researching basic code.  This is definitely something to keep in mind when suggesting FBML to your client or trying it out yourself, because if you don’t have this depth of knowledge I’d recommend looking to see if there is an existing application that you can use instead, such as for linking to blogs or a Twitter feed (check out Involver tool time post for a great easy option here!).   Otherwise, you will want to try it out on the Facebook Developers page to see what it looks like before posting it live:

All in all, I have to give FBML only 2 out of 5 slices – it’s a great idea for customizing a Facebook page, but definitely not the easiest for just anyone to implement and only best suited for creating tabs where there is no existing application to use.

Going to try it anyway? Here are some sites you’ll want to know:

3 Responses to “Facebook Tabs Made Easy (kind of) With FBML”


  1. 1 Hannah August 26, 2010 at 5:54 pm

    Nice post.

  2. 2 Henry Browna January 21, 2011 at 8:39 am

    I {previously|in the past|recently|sometime back} {commented|left a comment} {on your|in your|on the|onto your} {blog|weblog|website|web log|web site|site|web page|webpage|internet site|blog site|blog page|blogging site|web-site} and {selected|picked} {notify|inform|alert} me {on|upon|about|for} {new|latest} {comments|responses|commentary}. {Is there|Can there be|Perhaps there is|There has to be} a way to {disable|eliminate} that {service|system|online system}? {I am|I’m} {getting|receiving} {a lot of|lots of|plenty of|loads of|numerous|several|a whole lot of|a considerable amount of|a large amount of|quite a lot of|countless|large amounts of|a ton of} {e-mails|emails|mails}.

  3. 3 Andrew Smith September 16, 2011 at 8:33 pm

    Very illuminating thanks, I’m sure your current subscribers could quite possibly want a great deal more articles like this maintain the good hard work.


Comments are currently closed.




%d bloggers like this: