Having a Facebook Fan Page is all well and good, and we’ve been looking over the past few weeks how to create a facebook fan page, and also how to insert HTML into Facebook Fan Pages, now the final part – how to use FBML to create facebook features for your facebook fan page.
FBML is an incredibly diverse and there’s the substansial FBML Wiki on it, so it’s easy to get lost. However, there is really only one thing you need for FBML. Most of it surrounds applications, not necessarily fan pages. There’s really only one Facebook feature you’d want for your Facebook Fan Page – Inviting People to Your Facebook Fan Page
How To Create a “Invite Your Friends” Box For Your Facebook Fan Page
Very simple, this is the code you will need:-
<fb:fbml> <div style="padding: 10px; clear: both;"> <fb:request-form method="post" type="<a href="http://www.gospelrhys.co.uk/offto/facebook" style="" rel="nofollow" onmouseover="self.status='http://www.gospelrhys.co.uk/offto/facebook';return true;" onmouseout="self.status=''">FACEBOOK FAN PAGE</a> NAME" invite="true" content="Text to invite your friends. <fb:req-choice url='<a href="http://www.gospelrhys.co.uk/offto/facebook" style="" rel="nofollow" onmouseover="self.status='http://www.gospelrhys.co.uk/offto/facebook';return true;" onmouseout="self.status=''">FACEBOOK FAN PAGE</a> URL' ' label='GO' /> "> <fb:multi-friend-selector actiontext="Invite Box Title" rows="3" showborder="true" condensed="false" style="width: 300px;" /> </fb:request-form> </div> </fb:fbml>
Simple, but it needs a bit of explanation:-
<fb:fbml> - These open/close tags mimic the <html> tags, and allows you to use FBML within a page.
<fb:request-form> - This is similar to the <form> tag, and opens a form, and has a number of attributes:-
- type: this is the app or fan page associated with the form. In this case, it’s your fan page name (including spaces, if need be. For example, mine would be “The Gospel According To Rhys”).
- invite: this states whether or not you want to send an invite.
- Content: This will be what your invitee sees on their invite.
<fb:req-choice> - This places 2 or 3 buttons on the page, which simply a yes/no choice. The “Yes” (which is defined by the “label” field), will go to whatever’s in the URL field.
<fb:multi-friend-selector> – This is the very simple friend request form, that people have seen a million times before. There are certain things you can add to it as attributes:-
- actiontext:The title of the invite box
- width: width of the box
- rows: how many rows are visible
- showborder: show the border of the box
Word of Warning
Small word of warning, there is talk of changing the way this fbml works, so the multi-friend-selector may be depreciated in the next year or so. I will post a post up as alternative if/when this happens.
Questions? Anything You Want Adding?
If you want anything added to this, or anything you want to learn, do let me know!
Add an invite to your facebook fan page, and share it in the comments!