How to Insert “Add Profile Tab” Buttons

As described in an official blog post from Facebook, you can now put an “Add Profile Tab” button in your application or site to prompt users to add your application tab to their profiles for easy re-engagement. All implementations using the JavaScript API can call FB.Connect.showProfileTabDialog or use the fb:add-profile-tab XFBML tag to render the button, while FBML applications can call Facebook.showProfileTabDialog or use the fb:add-profile-tab FBML tag to render it.

Using the JavaScript API for Connect

FB.Connect.showProfileTabDialog(callback);

This method renders an Add Profile Tab button on your canvas or Web page, enabling the user to add your application tab to his or her profile.

If the user already added your application tab, the button doesn’t appear.

You can determine if a user added your application tab by querying the tab_added field in the permissions FQL table.

The optional Callback function can be used to execute after this call completes. It takes one argument, which is a JavaScript object. The object has one key, tab_added, the value for which is 1 or 0.

Using an XFBML tag

<fb:add-profile-tab />

or, if you’re using Connect

<fb:add-profile-tab></fb:add-profile-tab>

Renders a button that lets a user add your application or site’s application tab to his or her profile. Make sure you specify a Tab Name and a Tab URL in your application settings (on the Profiles tab).

If the user already added your application tab, the button doesn’t appear.

You can determine if a user added your application tab by querying the tab_added field in the permissions FQL table.

  • http://topsy.com/trackback?utm_source=pingback&utm_campaign=L1&url=http://thefacebookjournal.com/2010/04/08/how-to-insert-add-profile-tab-buttons/ Tweets that mention How to insert “Add Profile Tab” Buttons | The Facebook Journal — Topsy.com

    [...] This post was mentioned on Twitter by The Facebook Journal. The Facebook Journal said: RT @FacebookJournal How to insert "Add Profile Tab" Buttons | The Facebook Journal http://bit.ly/aQkwI7 [...]

  • http://bogdan.designlabs.ro/blog/ Bogdan

    How about a code sample that works?

  • Na

    This is it, IDIOT!!! >>> <fb:add-profile-tab></fb:add-profile-tab>

  • Bogdan

    Found out what the cause was – Facebook Connect URL was not set for the canvas app for FB.Connect.showProfileTabDialog to work.

    Thanks.

  • Jangla

    Is there any way of making an API call with FB so I can prompt the user of our web application to add our facebook application to their profile? Bear in mind, our web application is NOT our facebook application – they are completely different beasts; one is the output mechanism for things they configure in the other. I guess what I’m asking is, is there any way of passing an application id to this kind of prompt so you have control over which application you are asking your users to add to their profile page?

  • http://kiddiegrips.shikshik.org/2011/09/26/profile-tab/ Profile tab | Kiddiegrips

    [...] How to insert "Add Profile Tab" Buttons | The Facebook JournalApr 8, 2010 … You can put an Add Profile Tab button in your application or site to prompt … showProfileTabDialog or use the fb:add-profile-tab XFBML tag to … [...]