How to add a Meebo widget to a Facebook Page
November 15th, 2007With the release of Facebook’s new Pages system, libraries can now create an official presence not tied to an individual staff member’s account. But once created, options for what you can do with that page are still somewhat limited. For reasons I don’t entirely understand, not all Facebook applications that users can add to their profiles can also be added to a Page. As best I can tell, Application creators have to specifically allow this to happen in their options. And once they do, there are still a host of other issues that sometimes rear their heads.
One thing I really wanted to do was embed a Meebo widget in our library’s page, allowing users to IM a librarian directly from there. Of the two existing Meebo apps, one has not enabled the option and I can’t get the other to work right. So, here’s a temporary workaround:
Thankfully, Facebook has provided an app called Static FBML (FBML is the FaceBook Markup Language, the code that makes the magic happen). Essentially, this app is a blank slate. You can insert whatever custom code you like into it. We can use this to display a Meebo widget without too much difficulty:
Step 1: Add the Static FBML application to your Page.
Step 2: Edit the options. Go with whatever Box Title you like (I went with ‘IM a Librarian’).
Step 3: This is the meat and potatoes. Put this code in the FBML box:
<fb:swf swfsrc=’http://widget.meebo.com/mm.swf?XXXXXXXXXX’
imgsrc=’INSERT CLICKTHROUGH IMAGE ADDRESS HERE’
width=’380′ height=’300′ />
(NOTE: A commenter pointed out that you may have to replace the single curly quotes displayed in the code with non-curly quotes to get the code to work right. I can’t get my post to cooperate and display straight ones for some reason)
Step 4: Replace the X area with the link to your own Meebo widget.
Step 5: Replace INSERT CLICKTHROUGH IMAGE ADDRESS HERE with your own clickthrough image. Facebook will not display flash elements like a Meebo chat unless a user clicks on it. So you’ll need to create an image your users see, telling them to click on it to initiate a chat. For example, here’s what I’m using as my clickthrough:
Feel free to steal this image for your own use, just please host it on your own server and use your own bandwidth.
That should do it! Let me know if I can clarify anything here, as I’m just writing it off the top of my head. Hopefully this won’t be necessary for long and one of the ‘real’ Meebo widgets will enable Page usage soon.
You can see this live on the UNC Davis Library Facebook Page (still heavily under development): http://www.facebook.com/profile.php?id=6041853741
If you’d like to play with more custom content on your Page, Facebook has also created the rather aptly named Static FBML 2 and Static FBML 3 apps.
