Snipe.Net - Geeky Stuff

Static FBML: Not Every Facebook Fan Page Needs An Application

closeThis post was published 2 years 7 months 10 days ago. There is a chance that some APIs or software versions discussed have changed since this article was written.

You don’t always need a custom application for your Facebook fan page to look amazing. Save yourself time and money by using the Static FBML application instead.

If you’ve played around with Facebook pages at all, you know that layout-wise, you don’t have a lot of options. It’s one of the reasons some people prefer MySpace, where you can have custom font colors and sizes and custom backgrounds, and one of the reasons I personally have to be paid to logon to MySpace.

A current misconception seems to be that in order to have any custom content or display elements in a Facebook page, such as a custom tab or profile box with a specific promotion or branded look and feel, you need a Facebook application.

This is not true at all, and hopefully, I can save you a lot of time, headache and money by letting you in on a little secret.

There is a Facebook application called Static FBML that could potentially save you a lot of hassle. This application was put out by Facebook, and it allows you to create custom HTML/FBML boxes and tabs on your Facebook fan page.

At its most sophisticated, the Static FBML app can allow you pull FBML elements into a profile box, boxes tab box, or an entire tab, At its most basic, you can use it to create custom HTML boxes in those same places that you can completely design and brand to your liking.

For example, I recently worked on the Facebook fan page for Sunkist Soda. While we do use a custom application to display recent Twitter posts by the Sunkist Soda Twitter account, there is an entire branded tab that is simple HTML. The “Team” tab on this page isn’t a custom application – it’s simply a Static FBML box with custom HTML.

Sunkist Soda Fan Page - Static FBML Box

We also use a Static FBML box on the main page’s profile, with a small box that includes promotions for various campaigns.

The general rule of thumb is – if you don’t actually need to use any scripted languages like PHP or ASP, and you don’t need to access the API to get the user’s information for any reason, you probably don’t actually need an application. In our Sunkist Soda tab example, we’re not accessing the API, and we’re not doing anything database-related. We’re just displaying a nice background image and some thumbnails that link out.

The end result is a beautifully designed and branded tab or box that looks exactly the way you want it to look. When you need to update the content, just login to Facebook and make your changes in the Static FBML box.

Times When Static FBML is Enough

As I mentioned, if you’re not accessing the API and you’re not doing anything fancy, Static FBML will usually cut it. Also bear in mind that you can use Mock Ajax and FBJS in these boxes, so you could actually have a fairly dynamic tab/box, including expandable onclick elements, etc – without an application.

It basically behaves like a stand-alone webpage within your Facebook fan page.

Some suggestions on where beefing up your fan page with Static FBML can really help:

  • Promotional text/graphics that click through your Facebook application or website
  • HTML version of your latest newsletter in its own tab (with signup box!)
  • A shortcut to important links on your website
  • Any other place where you want a custom look and feel within your fan page

Figuring this out sooner rather than later can save you thousands of dollars if you’re considering hiring someone to help you. A contractor is going to have a vested interest in not mentioning this option to you, because it turns a specialized, several-thousand-dollar project into something any jackhole who knows basic HTML can handle themselves.

Also check out:

If you think this article kicked ass, subscribe to the RSS feed or follow me on Twitter! Share with your friends, or leave a comment below (or better still, do both!) My entire concept of self-worth is in your hands, so that makes you kind of a big deal. Srsly.

This entry was posted on Friday, June 26th, 2009 at 5:31 am and is filed under Featured, Web Development. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
  • http://www.snipe.net snipe

    @Tom – you go to EDIT PAGE and find the FBML box in the list of installed apps for your page. Then click on the pencil icon and go to EDIT. From there, you’ll have a box you can enter content into.

  • http://www.snipe.net snipe

    @Tom – you go to EDIT PAGE and find the FBML box in the list of installed apps for your page. Then click on the pencil icon and go to EDIT. From there, you’ll have a box you can enter content into.

  • http://www.myipdobroke.co.uk/ Yvonne

    Hiya,

    Like Anna, I don’t have much in the way of HTML experience, all I want to do at the moment is get users who click on my FB page to go to the Review page not the Wall. Also, can anyone tell me if people who do not have a FB account can view/comment on my group/fan page? Thanks.

    My page is

    http://www.facebook.com/pages/Stourbridge-United-Kingdom/MyiPodBroke/126671088776?v=app_6261817190&viewas=1601534468&ref=search#/pages/Stourbridge-United-Kingdom/MyiPodBroke/126671088776?v=wall&viewas=1601534468&ref=search

  • http://www.myipdobroke.co.uk Yvonne

    Hiya,

    Like Anna, I don’t have much in the way of HTML experience, all I want to do at the moment is get users who click on my FB page to go to the Review page not the Wall. Also, can anyone tell me if people who do not have a FB account can view/comment on my group/fan page? Thanks.

    My page is

    http://www.facebook.com/pages/Stourbridge-United-Kingdom/MyiPodBroke/126671088776?v=app_6261817190&viewas=1601534468&ref=search#/pages/Stourbridge-United-Kingdom/MyiPodBroke/126671088776?v=wall&viewas=1601534468&ref=search

  • http://www.snipe.net snipe

    @Yvonne – you do not need any FBML to do this. It’s an available option in your page settings.

    Go to EDIT PAGE > WALL SETTINGS – and click on the pencil icon to the right of the box, and go to EDIT. Pick the tab you wan to be the default for non-fans (“Default Landing Tab for Everyone Else”) from the dropdown list.

    This will only work for people who are not fans of the page – there is currently NO way to override the default (wall) tab from loading when a fan hits your page. The only option you have is to link directly do specific tabs if you want users to get there first.

    One way of doing this might be to create a redirect so that yoursite.com/fb automatically redirects to your FB page with the right tab loaded up, but you’d beed some basic scripting knowledge to do that.

  • http://www.snipe.net snipe

    @Yvonne – you do not need any FBML to do this. It’s an available option in your page settings.

    Go to EDIT PAGE > WALL SETTINGS – and click on the pencil icon to the right of the box, and go to EDIT. Pick the tab you wan to be the default for non-fans (“Default Landing Tab for Everyone Else”) from the dropdown list.

    This will only work for people who are not fans of the page – there is currently NO way to override the default (wall) tab from loading when a fan hits your page. The only option you have is to link directly do specific tabs if you want users to get there first.

    One way of doing this might be to create a redirect so that yoursite.com/fb automatically redirects to your FB page with the right tab loaded up, but you’d beed some basic scripting knowledge to do that.

  • http://www.myipdobroke.co.uk/ Yvonne

    You’re gonna think I’m totally stupid but I can’t see how to Edit Page > Wall Settings.

  • http://www.myipdobroke.co.uk Yvonne

    You’re gonna think I’m totally stupid but I can’t see how to Edit Page > Wall Settings.

  • http://www.snipe.net snipe
  • http://www.snipe.net snipe
  • http://www.myipdobroke.co.uk/ Yvonne

    Screenshots are fab and will really help BUT I don’t have anything like that on my page. I don’t see anything that lets me edit the page

  • http://www.myipdobroke.co.uk Yvonne

    Screenshots are fab and will really help BUT I don’t have anything like that on my page. I don’t see anything that lets me edit the page

  • http://www.snipe.net snipe

    Not sure what to tell you. You’re either looking at the wrong url (i.e. not your page’s main profile) or you’re not an administrator.

  • http://www.snipe.net snipe

    Not sure what to tell you. You’re either looking at the wrong url (i.e. not your page’s main profile) or you’re not an administrator.

  • http://www.myipdobroke.co.uk/ Yvonne

    How stupid am I??? :) ))) My husband is the administrator – no wonder I couldn’t see it. Done it now but it doesn’t appear to work, but I couldn’t see anywhere to save the changes, so I’m hoping that once I’ve logged off and on again, it will work. Thanks soooo much for all your help.

  • http://www.myipdobroke.co.uk Yvonne

    How stupid am I??? :) ))) My husband is the administrator – no wonder I couldn’t see it. Done it now but it doesn’t appear to work, but I couldn’t see anywhere to save the changes, so I’m hoping that once I’ve logged off and on again, it will work. Thanks soooo much for all your help.

  • Mark

    Can you tell me how to add a twitter box on a fan page like on this face book fan page? Thank you.

    http://www.facebook.com/admiralmikemullen

  • Mark

    Can you tell me how to add a twitter box on a fan page like on this face book fan page? Thank you.

    http://www.facebook.com/admiralmikemullen

  • Kali

    I have been using the fbml app on my fan page – super great and easy to use. I am wondering if there is any way to use this app or something of the sort on my personal profile page?
    Or how would you embed content onto your fb personal profile page?
    Any help would be greatly appreciated.

    Love your blog!

  • Kali

    I have been using the fbml app on my fan page – super great and easy to use. I am wondering if there is any way to use this app or something of the sort on my personal profile page?
    Or how would you embed content onto your fb personal profile page?
    Any help would be greatly appreciated.

    Love your blog!

  • http://www.facebook.com/people/Walton-Lewis/100000101225593 Walton Lewis

    Your bolded quote:
    “The general rule of thumb is – if you don’t actually need to use any scripted languages like PHP or ASP, and you don’t need to access the API to get the user’s information for any reason, you probably don’t actually need an application.”

    So I assume then that’s why I can’t get tags like to work? Because they pull user information via the API? is listed under fbml tags, so I’d think it should work for fbml taps. It’s not like I’m using javascript or php api calls…

  • http://www.facebook.com/people/Walton-Lewis/100000101225593 Walton Lewis

    Your bolded quote:
    “The general rule of thumb is – if you don’t actually need to use any scripted languages like PHP or ASP, and you don’t need to access the API to get the user’s information for any reason, you probably don’t actually need an application.”

    So I assume then that’s why I can’t get tags like to work? Because they pull user information via the API? is listed under fbml tags, so I’d think it should work for fbml taps. It’s not like I’m using javascript or php api calls…

  • http://www.snipe.net snipe

    @Walton – WordPress ate your code – can you post it again without brackets?

  • http://www.snipe.net snipe

    @Walton – WordPress ate your code – can you post it again without brackets?

  • http://www.facebook.com/people/Walton-Lewis/100000101225593 Walton Lewis

    The “fb:name” tag – will that not work? Because it pulls user info?

  • http://www.facebook.com/people/Walton-Lewis/100000101225593 Walton Lewis

    The “fb:name” tag – will that not work? Because it pulls user info?

  • http://www.snipe.net snipe

    I believe that is correct, but you can always try it and see. Incidentally, the fb:comments tag also does not work in Static FBML boxes. :(

  • http://www.snipe.net snipe

    I believe that is correct, but you can always try it and see. Incidentally, the fb:comments tag also does not work in Static FBML boxes. :(

  • Pingback: eleen.com » Add custom tabs to your Facebook Business Page

  • adrian

    Hey Snipe,love the article. I have a question hopefully you might know how to answer. I created a fbml tab and want to use horizontal navigation (much like spry tabs), however cannot get it to work for the life of me. I know fbml doesn’t except external javascript files, but i can’t get the spry function to work with out it. Any solution you know of?
    thanks,
    chewie

  • adrian

    Hey Snipe,love the article. I have a question hopefully you might know how to answer. I created a fbml tab and want to use horizontal navigation (much like spry tabs), however cannot get it to work for the life of me. I know fbml doesn’t except external javascript files, but i can’t get the spry function to work with out it. Any solution you know of?
    thanks,
    chewie

  • Natasha

    Hi Snipe,
    I am trying to create a promotional code for those who become a fan of my page. (Much like what 1-800-flowers is doing – http://www.facebook.com/iTunes?v=wall&viewas=100000044673860&ref=search#/1800flowers?v=app_4949752878&viewas=100000044673860&ref=nf)
    However, I am having trouble creating this. I need to make a different code for every Fan. Any suggestions?

    Thank you in advance!
    -Natasha

  • Natasha

    Hi Snipe,
    I am trying to create a promotional code for those who become a fan of my page. (Much like what 1-800-flowers is doing – http://www.facebook.com/iTunes?v=wall&viewas=100000044673860&ref=search#/1800flowers?v=app_4949752878&viewas=100000044673860&ref=nf)
    However, I am having trouble creating this. I need to make a different code for every Fan. Any suggestions?

    Thank you in advance!
    -Natasha

  • http://www.snipe.net snipe

    Hi Natasha – you’d need to make that an application, not an FBML box, since you’d need to tie into the API and execute additional code.

  • http://www.snipe.net snipe

    Hi Natasha – you’d need to make that an application, not an FBML box, since you’d need to tie into the API and execute additional code.

  • Facebook User

    I need to run an external .js. is this possible on a static fbml page? if yes, how? thx.

  • Facebook User

    I need to run an external .js. is this possible on a static fbml page? if yes, how? thx.

  • http://www.dents.co.uk/ Jimmy Ireland

    Hello there

    How do I get these banners http://www.facebook.com/pages/DENTS-Fine-Accessories-for-Men-and-Women/153712276351#/pages/DENTS-Fine-Accessories-for-Men-and-Women/153712276351?v=box_3&viewas=285700470 which feature in the boxes section on the wall page on the left hand side? i’ve seen other sites do this, yet I am having some difficulty.

    Thanks for any help :-)

    Jimmy

  • http://www.dents.co.uk Jimmy Ireland

    Hello there

    How do I get these banners http://www.facebook.com/pages/DENTS-Fine-Accessories-for-Men-and-Women/153712276351#/pages/DENTS-Fine-Accessories-for-Men-and-Women/153712276351?v=box_3&viewas=285700470 which feature in the boxes section on the wall page on the left hand side? i’ve seen other sites do this, yet I am having some difficulty.

    Thanks for any help :-)

    Jimmy

  • scout

    Thanks for pointing me to static fbml, its doing just the job i need.

    Only problem I’m having is, I have a two column layout, around 600px wide, with some images floated etc.

    This is all showing up fine, but the surrounding app box is still showing at about 200px wide by 100px. Is there anyway of removing this surrounding box. Its the one with the border around it, and a small light blue header. I really want to get rid of this so that the box looks like a stand-alone element, as in the sunkist example above.

  • scout

    Thanks for pointing me to static fbml, its doing just the job i need.

    Only problem I’m having is, I have a two column layout, around 600px wide, with some images floated etc.

    This is all showing up fine, but the surrounding app box is still showing at about 200px wide by 100px. Is there anyway of removing this surrounding box. Its the one with the border around it, and a small light blue header. I really want to get rid of this so that the box looks like a stand-alone element, as in the sunkist example above.

  • http://www.snipe.net snipe

    @Jimmy – I’m not sure what your question is, exactly.

    @scout – can you show me what you mean?

  • http://www.snipe.net snipe

    @Jimmy – I’m not sure what your question is, exactly.

    @scout – can you show me what you mean?

  • scout

    @snipe Actually, the problem seems to be solved thanks. The Application box (the surrounding border and light blue header) is showing when I’m logged in and editing the page, but it doesn’t appear to anyone else who actually views the page, so it’s really not a problem at all.

    Sorry, it’s not a great photo, as I don’t want to show too much of the clients stuff at the moment in case they get funny, but here’s what I was talking about anyway, if you can make it out

    http://www.flickr.com/photos/11687206@N07/3886010955/

  • scout

    @snipe Actually, the problem seems to be solved thanks. The Application box (the surrounding border and light blue header) is showing when I’m logged in and editing the page, but it doesn’t appear to anyone else who actually views the page, so it’s really not a problem at all.

    Sorry, it’s not a great photo, as I don’t want to show too much of the clients stuff at the moment in case they get funny, but here’s what I was talking about anyway, if you can make it out

    http://www.flickr.com/photos/11687206@N07/3886010955/

  • jamie

    http://www.facebook.com/target#/target?v=app_82676004266

    is this a static fbml page? looks like it..but there is a comment area.

    I am building a fanpage with Static FBML and I need to embed 2 facebook comment boxes for users to leave comments. Is this possible? The canvas app is looking to possibly be a bit out of my current knowledge range.

    Any words on this would be greatly appreciated.

  • jamie

    http://www.facebook.com/target#/target?v=app_82676004266

    is this a static fbml page? looks like it..but there is a comment area.

    I am building a fanpage with Static FBML and I need to embed 2 facebook comment boxes for users to leave comments. Is this possible? The canvas app is looking to possibly be a bit out of my current knowledge range.

    Any words on this would be greatly appreciated.

  • inquiring

    Hi there,

    I’ve been running to a problem with the Static FBML app no longer (as of 9/2, i think) being able to move boxes to the Wall. Judging by comments on the app discussion tab, it looks like i’m not alone. Do you have any insight/suggestions on how we can get this to work? It was working for us on Tuesday, and then Wednesday, poof.

    TIA!

  • inquiring

    Hi there,

    I’ve been running to a problem with the Static FBML app no longer (as of 9/2, i think) being able to move boxes to the Wall. Judging by comments on the app discussion tab, it looks like i’m not alone. Do you have any insight/suggestions on how we can get this to work? It was working for us on Tuesday, and then Wednesday, poof.

    TIA!

  • http://www.facebook.com/heatherrichardslive Heather

    I tried to add FBML to my fanpage. It gives no options to edit. How do I delete this from my fanpage? It has no options to do anything and I don’t see it in my applications. It sits in my dropdown list, but gives no option to delete it. I would like to delete it then readd it to my fanpage, not my main profile page. Any advice?

    Heather