Spice Up Your Facebook Application with a Userplane Chat Client

At their core, Facebook applications are all about social interaction. Adding a chat client to your Facebook application provides the social interaction that will drive usage. With very little effort you can add Userplane’s chat service and also generate revenue. In this post, I’ll show you how to integrate Userplane’s chat client into a Facebook application. The main tasks for this project are creating a Facebook application, creating a Userplane account, and finally putting the two together with some code. My Facebook application, MartiesIM II, is available at http://apps.facebook.com/martiesimii. Here’s a screen shot of the application: [img]http://beavercreekconsulting.com/img/dac.mk.up3.ss.png[/img] I’m focusing on how to integrate with Userplane so the Facebook application I’ve developed has no functionality beyond launching the Userplane Chat client. Userplane has two models for delivering their services, Instant Install and Integrated. The Integrated model is more feature rich; however, there is more development required to support this model. In this case, I selected the Instant Install option. Revenue sharing via Userplane money comes built in with the Instant Install model. I headed over to Userplane (http://userplane.com), created an account, and obtained an Userplane Domain ID. At the same time, one can get code snippets for embedding the Userplane client on a web page. The next step is to create a Facebook application. From your Facebook account install the Developer application (http://developers.facebook.com/get_started.php). Launch Developer and then click on the big “Set Up New Application” Button. You are then presented with a screen to select the application name. After selecting the application name, expand the “optional fields” tab, and select the correct options... So many options -- none of which make sense if you haven’t developed a Facebook application before. If this is the case, spend some time looking at the developer documentation at http://developers.facebook.com. The short story is that to create a Facebook application you’ll need a web server to host your application code. Your server’s output will be embedded into Facebook pages. This brings us to the two most important options on the Facebook new application page; namely the Callback URL and the choice of FBML or IFRAME in the canvas option. The Callback URL should point to the root directory of the application on your web server (which needs to contain an index page). The Userplane client worked for me only with the IFRAME option. The last task is to write the application. I installed the PHP version of the Facebook client library (which is available at http://developers.facebook.com/resources.php). I coded up some PHP and located the code listed below in an index.php file under my Callback URL (http://beavercreekconsulting.com/fb/martiesimii – you can also see the application at this URL). On line 3 the Facebook client library is imported. On lines 5-7 Facebook credentials are set. Facebook credentials are available in the Developer application on the application’s profile page. I’ve commented out the require_login() method on line 14 which should allow you to see the application without a Facebook account. Typically, one would force the login so that the application can interact with the user’s Facebook data. And finally, lines 35-44 are the code snippet for the Userplane client. The Userplane Instant Install gets the integration done quickly. I’m starting to look at the Integrated Model as it should allow me to build applications with richer interaction. [code] 001 require_frame(); 012 013 // Commented out so you don't need a facebook ID to see the application 014 //$user = $facebook->require_login(); 015 ?> 016 017 025 026 027 [/code]