Friday, January 21, 2011

Two Cool Static FBML Tags: Display Visitor's Username; Generate Random Messages

Amplify’d from www.hyperarts.com
Hello <fb:userlink uid="loggedinuser" />! Thank you for visiting my Page!

Two Cool Static FBML Tags: Display Visitor's Username; Generate Random Messages

Static FBML Facebook's Static FBML application is one of the most popular apps for Fan Pages, allowing users to create custom tabs to promote their business, service, brand or whatever using CSS, HTML and FBML to create both attractive and engaging custom tabs.

Static FBML supports a small subset of FBML tags, the most popular being those that allow for:

  • embedding Flash, video and photo galleries (fb:swf, fb:flv);
  • embedding of MP3 files (fb:mp3);
  • sharing with your friends a Page or its content (fb:share-button, fb:multi-friend-selector);
  • adding the ability for visitors to comment on and/or Like specific content (fb:comments);

However, there are a couple lesser-known FBML tags that can personalize your tab or create random messages: fb:userlink, which displays the visitor's full name; and fb:random, which allows you to have different sets of content that display randomly, based on a "weight" value you set.

Greet or Otherwise Address Your Visitor by Name — fb:userlink

People have been asking how some Pages can greet a user by name. This is done using the fb:userlink FBML tag which fills in the user's name, as it is on Facebook, and can be integrated into a sentence or headline by entering the following into your Static FBML box:

Hello <fb:userlink uid="loggedinuser" />! Thank you for visiting my Page!

The above results in this when I view the tab while logged in to Facebook:

Display Username on Facebook Tab with FBML

Just insert the FBML tag wherever you want the user's full name to appear, as in the above example.

Although on Facebook's documentation page for fb:userlink, it states that the tag is deprecated (will no longer be improved and will eventually be phased out), as of this writing it is working just fine. It's not uncommon for deprecated tags, whether HTML or FBML, to stick around for years.

Create Weighted Random Messages on your Custom Tab — fb:random

Another little-known FBML tag is fb:random which allows you to present alternating sets of content in a random but weighted manner, adding a "weight" value for each nested fb:random-option tag:

<fb:random>

<fb:random-option weight="2">

A: This will display twice as often as B and can contain any HTML content — links, images, forms, even <a href="#" clicktoshowdialog="example_dialog"><strong>a nested dialog box</strong></a>! (You will need to reload this tab and again click on the fb:random tab to see it again.)

</fb:random-option>

<fb:random-option weight="1">

B: This will be show half as often as A. (You will need to reload this tab and again click on the fb:random tab to see it again.)</fb:random-option>

</fb:random>

The example on our Static FBML Bible Page, is weighted so that message "A" is displayed 2 times for every 1 time that message "B" is displayed:

Message A:

FBML Random Message A

Message B:

FBML Random Message B

As you can see from my example, you can nest other FBML tags within the fb:random-option tags, and incorporate the same type of content you can on other parts of the tab. On our example tab, we nested a fb:dialog tag which causes a popup image when the user clicks on the "a nested dialog box" text.

You can add more than two fb:random-option tags to create more alternate messages. And, if you have more than 2 fb:random-option tags, you can add the "pick" parameter to fb:random to have more than one option returned each time. So if you have, say, 3 or 4 or 5 options, you can set the tag so that each time it returns 2 of those options:

<fb:random pick="2">

The above will result in the display of 2 of your options each time the tab is loaded. (There is a "unique" parameter as well, with the default set to "true" which is what you should prefer, assuming you don't want the tag to display the same option twice!)

Read more at www.hyperarts.com
 

No comments:

Post a Comment