Adding a custom tab to your facebook page using Static-XFBML

3,665

January 12, 2012 by admin

***This version is outdated New version coming soon, subscribe to be informed***

The easiest way to add a custom tab to your facebook page is to use a custom tab builder. In this tutorial we are using Static XFBML : Custom | Static XFBML : Multiple

You can find the Application here

Find the add Link

The first thing you need to do is add the app to the fan page you want to add a tab to.

First go to the app page here scroll up and find the button on the top right that says “Go to App”

Add To your Page

If you have not authenticated the app it will ask you to. You only need authentication the app once and none of your information is stored.

Authenticate The App

Authenticate the app by clicking allow.

Once you allow it the popup will close and redirect you to a list of all pages you have admin rights to.

Choose the page you want to add it to from the list.

Then click on the Add static-XFBML to My Page

This will redirect you to your page.

NOTE

Make sure your page is published and has no country restriction else the app may not function as expected.

Find your new Custom Tab

Once you added the app it will redirect you get to your page you added the app to you should see a “welcome” tab on the left below the rest of the menus. Click it to add content to your tab.

If you cannot see it click on edit, this should display all your menus. If you still cannot see the welcome tab do this:

1. Click on “edit info” at the top of your page – you must have admin rights.
2. Look for the Apps menu on the left and click on it
3. Now find the Static-XFBML app and click on Application setting link below it.
4. This should bring a dialog box up , now click on add give the tab a different name and save. Now return to your page and you should see the Custom Tab menu.

Updating Your Tab Content

As the admin of your page you will always be presented with the admin area as the default display.

You will be presented with two boxes one for general content for all and another for non-fans. If you leave the non-fans box empty everybody including fans and non fans will see the general content. If you do decide to put content in the non fan box then this means non fans will see this content. As soon as they like your page they will see the general content.

Make sure you save your changes once you are done. To preview click on “view fan content or view non-fan content” :

To get back click back to admin panel.

You can include HTML,CSS, javascript, xfbml,images, videos and flash in you custom tab.

NOTE

If you are an admin of the page you will always see the admin panel load when you click on the tab. You can log in as a non admin user to see how your tab will be displayed to users.

There are 3 types of static XFBML

1. Static-xfbml: Custom Tab builder – for adding custom tabs to your fan page (Start off with this one – This is the one used in this example.)
http://apps.facebook.com/static-xfbml

2. Static XFBML:Multiple Tab builder – Has the old “on top of the page” multiple menu style , pretty handy if you have loads of section on your page.
http://apps.facebook.com/static-xfbml-tabs

3 . Static XFBML: Location Tab Builder: With this tab you can target specific content to your users depending on there location.
http://apps.facebook.com/static-xfbml-geo

like.tweet.g+ this post if you found it useful.

Thanks

OA for fb-520.com

Category How To, News, Tutorials | Tags: facebook tabs, like button, static XFBML, tab builder