Posted on 8 July, 2009 By
Kim Woodbridge
60 Comments
How to Add a Custom Tab to a Facebook Fan Page
People often ask how to rename the page tabs on their facebook fan pages. Unfortunately, this functionality does not currently work. Facebook used to have this feature but it hasn’t worked since the last update.
You can, however, use the fbml application to create a custom box that is used as a tab. The tab will be whatever you name it, such as Welcome or Services, and that tab will contain whatever data you included in that fbml box.
- Install the Static FBML application on your fan page.
- Select the link that says ‘Add to My Page’.
- Go to the main page and click on Edit page
- Select the FBML application and click on the pencil icon to begin editing the page.
- Name the box and add your html or text. Then save the changes. By default this will be a new box or your boxes tab.
- Go page to the Edit page that lists all of your applications. Locate the fbml box that you just created and select Application Settings under the pencil icon.
- Click on remove to get rid of the box and then click on add to convert the new box into a tab. Then click on ‘Okay’.
- You will have a new custom tab with the content that you added to the FBML box.
- Unfortunately, you can’t add more fbml boxes to the custom tab so everything you want under this tab needs to be contained in that one box.
- If you want to make more custom boxes or tabs, edit the fbml box that you have already made and then scroll to the bottom of the page. Here is where you can add more boxes – a new browser tab or window will be opened to do this. Once you use fbml for the first time, it no longer looks like the application is available and people think they can only use one box. It’s just that the application is replaced by the boxes that you make and at the bottom of the edit screen is where you can create more of them. I don’t know why that it but it’s super confusing.
I made a tab to test this and deleted it. I already have the information that I want on my fan page but I suppose I could create a separate tab for Services, Portfolio, or Contests.
You can view my fan page at http://facebook.com/Anti.Social.Development.
photo credit: joeshlabotnik
Related Posts:
Posted In :
Facebook
If you enjoyed this post, please subscribe to my RSS Feed
60 Responses to “How to Add a Custom Tab to a Facebook Fan Page”
Trackbacks/Pingbacks
- The Bull’s Roar – Facebook Pages: Goals, Fans and Engagement
- Finding the Crowds | Dean Holmes
- How to Add a Flash Video to a Custom Facebook Fan Page Tab | (Anti) Social Development
- FBML – How to Add a MP3 to a Tab on Facebook Fan Page | (Anti) Social Development
- UMapper » Blog Archive » Add UMapper Map to a Custom Tab on Facebook
July 8, 2009 at 8:04 am
Hey you are really getting a lot of work to facebook since you started freelancing huh? Is it because you have more time or you find it a good client-recruiting place…?
stratosg´s last blog post – The theme change
July 8, 2009 at 4:02 pm
Hi Stratos – I’m getting visitors to the site from facebook. I’ve getting
some work from that but mostly to work on facebook rather than WordPress.
July 8, 2009 at 9:28 am
Thanks! I finally set up my facebook fan page but it’s sooooo plain!
I’m curious like Stratos, how is facebook working for you in connecting with potential clients?
My blog gets some traffic from FB, but I think it’s people posting links in their status updates, because I can’t see where the referrals are coming from.
Tracy´s last blog post – My two favorite emotions are lucky and enthusiastic
July 8, 2009 at 4:05 pm
Hi Tracy – So far I’m getting more people finding out about me through
facebook than work. And the work I’ve found that way has been to
work on facebook, which is fine with me. Facebook is a bit of a pain
but I find it to be a nice break from WordPress. ;-) Most of my business
right now is coming from recommendations – people I’ve worked with
are recommending me to others.
Yeah – you can see that the referrals come from facebook or
networked blogs but nothing more specific than that.
July 8, 2009 at 2:25 pm
My MomGrind fan page is so basic. I need to save these and spruce it up a little, when I have the time.
Vered – MomGrind´s last blog post – Retouching As An Act Of Kindness
July 8, 2009 at 4:06 pm
Hi Vered – Do it all at once when you’re already cranky because facebook
can be such a pain. It’s not hard but it’s so unintuitive.
July 9, 2009 at 5:18 pm
I really like how the ASD Facebook page is looking. Great job. And glad to hear its getting people to your site. :-)
July 10, 2009 at 9:59 am
Thanks Jim
Did you ever try Tab? It is disgusting.
July 13, 2009 at 11:23 pm
Thanks, your instructions were perfect, and I was able to set up the new tab that I wanted on my Facebook page.
Debra Dalgleish´s last blog ..14 Basic Skills For Excel Users
July 14, 2009 at 6:25 am
Hi Debra – Great! I’m glad it worked for you.
July 14, 2009 at 5:58 am
Hi there,
This information that you have provided is brilliant. I am completely new to all of this and wanted to ask:
In stage 5 of your article “How to Add a Custom Tab to a Facebook Fan Page” where you state information on “Edit FBML” how can I get hold of the correct HTML data to paste in to the “Edit FBML” box?
Thank you!
July 14, 2009 at 6:26 am
Hi Shay – The html would be different depending on what content you want to place in the box. In order to use the Static FMBL application you really need to know some html.
July 14, 2009 at 6:31 am
Thanks for letting me know. Do you know where I could really simply html data from to create a standard tab template?
July 14, 2009 at 6:42 am
Hi Shay – It really depends on what you want on the template. I’m not aware of anywhere to obtain specific html.
July 15, 2009 at 4:20 am
Excellent! I was wondering how some people put custom tabs to their pages. I thought it’s a premium option in FB. Thanks for sharing this great piece of information. Added you to my RSS :-)
Ami´s last blog ..The Tataki-dai Principle
July 15, 2009 at 11:23 am
Hi Ami – Great! I’m glad this helped you out.
July 28, 2009 at 5:40 pm
The Add to my page link does not appear when I go to the Static FBML page. It only says Add to my page favorites. How can I actually add the application to utilize it? Thanks!
July 29, 2009 at 8:01 am
Hi JW – Static FBML is only for fan pages and doesn’t work with profile pages. If you are unable to add it, you are either not the admin of a fan page or you have already added the application to the fan page.
Otherwise there is a bug in Facebook and I would recommend trying again later.
July 29, 2009 at 5:30 pm
Thanks for your help. Yes we are a biz fan page, I’m the only admin and am logged in as such. I don’t think it is loaded since I’m the only one touching the page. Hmm… I tried again today and no luck.
Not sure if there is a setting I need to activate or what to get it to work. Any other tips?
July 30, 2009 at 7:50 am
Hi – Is you page published yet? It seems that some people have not be able to add it before the page is published.
Here’s the discussion area for the app where I found that thread.
http://www.facebook.com/apps/application.php?id=4949752878&v=app_2373072738&viewas=629152408&ref=search
January 10, 2010 at 8:36 pm
JW
Were you ever able to get the static FBML “add to page” link? I’m having the same problem and it’s frustrating. We have a published fan page and I’m the admin. Let me know what worked for you.
September 3, 2009 at 12:22 am
Hi I was wondering how I can add the become a fan tab to the profile page
September 4, 2009 at 8:39 am
Hi Angie – I don’t believe you can add a custom tab to a profile page – only to a fan page.
October 25, 2009 at 9:48 pm
Hi ive followed your instruction up till edit page which directs you to the page edit but however when I click on FMBL pencil theres only ‘browse more’ thats comes up in the admin selection theres no edit selection. can you help please
October 26, 2009 at 7:51 am
Hi Shaila – I tested this on my own fan page and it is working fine. Make sure that you are the admin and try logging out of Facebook and back in. Sometimes Facebook is buggy – when that happens I stop working on it and come back later.
October 29, 2009 at 8:19 pm
thanks Kim,
ive figured it out. check out
http://www.facebook.com/pages/Lavazza-A-Modo-Mio-Club/162437154203?v=app_4949752878&ref=nf
does it show up in your computer.
:) we had issues with displaying on some and not in some.
can you help?
October 30, 2009 at 8:47 am
Hi Shalia – It looks great! I wonder if the problem is a browser issue. I looked at it Firefox 3.5 and IE 7 and it worked in both.
November 1, 2009 at 7:42 am
thanks heaps Kim,
we fixed it on friday. took us a whole day but so worth it. Be a fan if you get a chance. we trying to get a 1000 so we can get a personal url name. Please suggest us to others. lavazza is a great coffee.
take care :)
November 2, 2009 at 7:39 pm
Kim,
Any idea on how to add multiple Static FBML tabs to a page? It seems that you can’t add a second or third tab with different code in it.
Thanks for the help!
John
John Haydon´s last blog ..Why Twitter lists are huge for your non-profit or small business [video tutorial]
November 2, 2009 at 8:00 pm
Hi John – After you create one FBML box and set it as a tab, go back to edit that box – Edit Page > Name of FBML box > Pencil Icon > Edit. At the bottom will be a link to create another FBML box. Create the new one just like you did the first one. Once it is saved go to Edit Page > Name of new FBML box > Pencil Icon > Application Settings >Add Tab. You can also remove the box.
The new tab might now show up because there isn’t enough room for it. Click on the arrows on the tab row – you should be able to reorder the tabs by dragging it to the correct location.
November 20, 2009 at 11:15 am
I found this post very helpful! I quickly added a custom tab to my Facebook fan page (at http://www.facebook.com/pages/Intel-Atom-Developer-Program/136829464493). The instructions were clear and correct. Thank you for posting!
November 20, 2009 at 11:16 am
The correct link is actually this (the parenthesis got in the way in my previous post):
http://www.facebook.com/pages/Intel-Atom-Developer-Program/136829464493
November 20, 2009 at 1:05 pm
Hi Gina – Looks great! I’m glad the tutorial helped. :-)
November 26, 2009 at 5:24 pm
How do I go about having the contents of this custom tab (say it is an image/banner with a click thru) to be featured on the left hand column of a business page??
November 26, 2009 at 5:38 pm
Hi Jieun – You would go to Edit Applications, locate the name of the fbml tab, click on Application Settings and select Add as Box. The Box will go to the Boxes tab so go to that tab. Select the pencil icon and choose move to Wall – it will them be on the left hand column.
Please note that boxes will be removed by the end of the year and it will no longer appear in the left hand column so you might not want to do this.
http://www.kimwoodbridge.com/upcoming-facebook-changes-to-boxes-and-the-box-tab-that-will-impact-your-custom-fan-pages/
November 26, 2009 at 8:19 pm
Thank you Kim…
While I am following your instructions very carefully, when i select the pencil, the only option i am given is to Delete the tab.
Is there any other way or another application i can use to accomplish what i am trying to do?
as an example – see the Shop Mavi banner and Sign up for email banner : http://www.facebook.com/pages/Vancouver-BC/Wallop/48459801271?v=app_4949752878#/pages/Mavi-Jeans/136768585045?ref=search&sid=543135098.1529563427..1
November 27, 2009 at 7:47 am
Hi – You have to go to the Boxes tab, where the box should be located and then select the pencil icon on the item that you want to move to the Wall sidebar.
I can’t see the pencil icons on your page because I’m not the Admin of it. I did, however, test the instructions on my own page and it worked.
November 27, 2009 at 12:35 pm
awesome, yes it worked. thank you so much!
November 30, 2009 at 10:10 am
I’ve added the static fbml app uploaded the following code to box and the email form appears but does not work. this msg appears –
The page you requested was not found.
You may have clicked an expired link or mistyped the address. Some web addresses are case sensitive.
* Return home
* Go back to the previous page
looking to get a fix for this. Again looking to add a email opt in box to a facebook page
code:
Name:
Email:
Comment:
November 30, 2009 at 4:26 pm
Hi Tone – If you are getting that error, it sounds like something is wrong with the code for the email form – not with the fbml appplication.
December 13, 2009 at 12:10 pm
I’m trying to create a auto responder template and put it on the Fan Page as the instructions above but for some reason the Aweber template will not show up.
is there limitation on size..etc
I see John Assaraf has done it and I would like to do the same thing. here is the link to his fan page.
http://www.facebook.com/search/?flt=1&q=fan+pages&o=65&sid=649535286.4014107715..1&s=10#/johnassarafpage?v=app_11007063052
I would love some help to configure this.
Thank you,
December 14, 2009 at 7:41 am
Hi Brandon – Did anything show up? Were there any scripts on the page? Facebook will allow a html form but scripts will not work.
The content on a tab can currently be 600px but will be reduced to 510px very soon.
December 14, 2009 at 5:05 pm
Thanks for the helpful info. REALLY appreciate it. Al
December 14, 2009 at 8:05 pm
Hi Al – Great! I’m glad it helped.
December 23, 2009 at 4:13 pm
Hi Kim;
Thank you for a great tutorial – very helpful.
I have followed your instructions and created a tab that contains my content (rather than a Box), I would however also really like to have the content of the tab show up in the left hand column. Is this possible when using tabs?
Thank you again for sharing your insights, much appreciated.
December 23, 2009 at 7:18 pm
Hi Therese,
Unfortunately, not anymore. All boxes and the Box tab are going away any day now. Facebook said this would happen at the end of this year or the beginning of next. It’s best to just focus on creating tabs.
I have an article about this issue.
http://www.kimwoodbridge.com/upcoming-facebook-changes-to-boxes-and-the-box-tab-that-will-impact-your-custom-fan-pages/
December 24, 2009 at 12:45 pm
Thank you for taking the time to reply Kim, much appreciated.
December 24, 2009 at 2:07 pm
Hi Therese – I try to answer all comments :-) And I didn’t want you to spend too much time with Boxes when they are going to be going away …
January 2, 2010 at 8:18 pm
Thank you!!! You rock!
I’ve finally named my “Welcome!” tab….. and everyone else seems to think Facebook has disabled that feature! Once again thanks!!!
January 3, 2010 at 8:01 am
Hi – I’m so glad it worked :-) I’ve been making tabs so that feature still works – the boxes tab, however, can’t be renamed.
January 21, 2010 at 8:15 pm
Hi Kim,
Really great blog!
So I created a new tab on my fan page but I have a few questions:
1. Is it possible to embed a picture into this new tab? (Specifically if the picture is not already on the net somewhere) (Can you add the pic to facebook and reference that?)
2. Is is possible to change the background color of the tab? Do you have any examples of how?
Thanks in advance !
January 22, 2010 at 9:32 am
Hi Paul – If an image doesn’t exist on another server, the only images that can be used are the logo for the fan page or your profile picture. And then FBML code must be used to make it work. It’s a lot easier to upload the pictures somewhere and link to them.
As far as I know the actual color of the tab can’t be changed but you can change the background color of the fan page. That would require inline CSS or pulling in a style sheet that sounds the color of the background.
January 28, 2010 at 5:48 pm
kim im trying to add the fbml to my page but its not giving me the option to it only says add to favorites? please help me thanks
January 28, 2010 at 7:40 pm
Hi Candace – Are you doing this from your profile page or your fan page? Static FBML can’t be used on profile pages.
February 2, 2010 at 1:30 am
Hi Kim!
I was trying to add a tab, but after I added it, I went to edit it and deleted it instead. Now when I try to add a tab again, my fan page doesn’t show up in the list…how would I fix this??
Thanks in advance for your help!
February 2, 2010 at 10:13 am
Hi Hannah – The fan page is missing? If you didn’t delete it, that is odd. I would do a Facebook search for it and also try logging out of Facebook and back in. It sounds like Facebook bugginess to me.
February 2, 2010 at 5:34 pm
Sorry, I should have clarified: I was trying to install it, and editing the tab didn’t work, so (like any tech newbie) I thought that deleting and reinstalling it would solve the problem. Is there any way to recover/relink it FBML once that’s happened?
February 2, 2010 at 8:59 pm
Hi Hannah – Maybe. See if you still have the Static FBML app and go to add a new instance of it. At the bottom is a add new link. Frequently when I add a new instance of FBML for a new tab old FBML blocks/tabs come back – even ones that I really wanted to be deleted.
If it doesn’t come back when you do this, then, unfortunately, the code is gone and it will need to be recreated.
February 4, 2010 at 12:15 am
Thank you…
thank you……
thank you……..
thank you………
thank you……………. veryyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy Much… My biggest headache is solved through this article…
T H A N K S
(n_n)
February 4, 2010 at 11:00 am
Hi Ahmed – Great! I’m so glad it helped.