Facebook Page and PHP SDK

10 Feb

I’ve been doing some work on our facebook page recently and thought I’d share my experiences.

After a bit of reading and checking out other pages on there it seemed like a good idea to change the main images we use. You can use an image up to 200px by 600px and it makes sense to make the most of this. this is the one I came up with, I think it does the job quite well. Bear in mind that you need to be able to make your icon from this image, I left a lot of orange space around the top to make this easier.

Next was to tidy up the menu on the left, it was a bit of a mess and didn’t really have any consistency. I got rid the FBML stuff that was on there as it was a bit rubbish and set about creating my own pages.

FBML is being deprecated as of 1st June 2012, so it’s not worth going down that route. Writing your own php pages (which will appear in iframes) allows you to create far more powerful applications.

First, download a copy of the Facebook PHP SDK from here. It’s pretty well documented and I would recommend having a little play with it. The iframe width is 520px, always, so set your outer div to that size and you can’t go too far wrong.

You will need to be logged in to facebook under your individual account and you can then navigate to https://developers.facebook.com/apps where you can create you new app (this new ‘app’ will basically be a menu item on your page, well, strictly speaking it will contain the link(s) to the php page(s) which you will store on your server.)

Give your app a name (you can change what will appear as the ‘page tab name’ later on) and then give it a nice icon. If you are struggling, you can always check out Google images and search by the specific size of 16px by 16px.

It’s worth noting that your server needs an SSL certificate as Facebook requires both http and https versions of your pages.

If you’ve followed any other guides (like me), you’ll probably get as far as the last step, which is adding the app to your page menu. That magic link no longer exists, but fear not, you can get around that.

When you create your app you will get an ‘App ID’ and you will know the url that the iframe is pointing to. Armed with these 2 pieces of information, create the following URL:

http://www.facebook.com/add.php?api_key=[MY APP ID]&pages=1

Replace [MY APP ID] and then navigate to it. you can then select which page you cant to add the app to, simple.

The hardest part is deciding what apps (tabs) to make, I would recommend having a look around and see what works for others.

There is some nice php code here which allows you display different content in your iframe page, depending on whether a user have liked your page or not. this means you can hide content from users until they have liked you, thus driving up the number of likes you get, hopefully.

I ended up writing quite a few apps, all which are menu items on our corporate Facebook page. I wrote:

  • About us
  • Contact us
  • Testimonials
  • Videos
  • Games (which can only be played if the user has liked us)

I also created a ‘Like Dore’ page, which I’ve set as the default landing page. This page contains an image, persuading users to like us. If they already like us, the page automatically forwards them to our wall.

if ($like_status) {

All the pages have been styled using CSS and the corporate colour scheme and I’ve used quite a bit of JQuery to pimp it up.

All in all, our Facebook page is looking a whole lot sharper now, likes are up and hopefully if we keep the content fresh, this will continue to increase.

Check out our Facebook page here, and don’t forget to click like!