We recently did a complete rebranding project for our client Cobec, which included not only a new website driven by WordPress, but also a couple of Facebook apps.

The requirements were fairly simple—two tabs on the Cobec Facebook page: “What We Do” and “Careers” (you can see the final result in the first image below). To start, I registered myself on Facebook with my work email address and created a Cobec test page so I didn’t risk mucking with the client’s page while developing and testing. Creating the apps themselves was a little tricky because I had never done any FB development before, but once I got the hang of the functionality in developers.facebook.com, it wasn’t too bad. These apps basically just display an external web page in Facebook’s content area through the use of an iFrame. The bulk of the work in Facebook is registering the apps, pointing them to the proper external URLs, and then adding the apps to a page.

One of the requirements for the apps was that they reuse content from Cobec’s website. Since the website was built in WordPress, creating the FB app pages and reusing content was as simple as copying the WP theme from the main site to a new theme folder and restyling the site with a fixed width to match Facebook’s iFrame. You may at this point be asking yourself how I got the Facebook apps to use the theme for FB instead of the website theme, which is an issue I wrote about recently. Click here if you are curious how that was handled.

You can check out Cobec’s Facebook page here.

The same content on the Cobec website:

Posted by Brian Chenault, developer for Business Bullpen. You can follow Brian on Tumblr or Twitter.