Adding bespoke content to Facebook Pages

2 minute read

Facebook appears to be, on the surface of things, the least customisable social network in terms of design, particularly in comparison to Myspace or Youtube, However, due to its modular nature and the application platform it is surprisingly easy to add custom content to your Facebook page.

The most useful application for adding content to your pages is Facebook’s own Static FBML application.

This application allows you to add HTML to your page, either as full tabs or profile boxes. There are some limitations but I find it is very similar to coding for Email. In the example below I will explain how to add a promotional button to your Facebook wall.

You will want to prepare your image beforehand, You can make it as tall as you like but the maximum width is 180px to fit onto the wall tab.

freetrial

Browse to the application and add the application to your page.

addtopages

Now navigate to your page and click the edit page button, look for the Static FBML box and select edit from the menu.

editfbml

Here we will add a title for the box and our HTML. The code below will add an image and link it back to Sign-Up.to. You can create your own HTML in Dreamweaver or even the Sign-Up.to editor if you like, or simply change the code below to insert your own image and link.

fbmlcode

<a href=” INSERT YOUR LINK HERE “><img src=” INSERT IMAGE LOCATION HERE ” alt=” INSERT A DESCRIPTION OF YOUR IMAGE HERE “/> </a>

TIP: If you need somewhere to host your image, upload it to Facebook and copy the image path by right clicking the image and selecting properties.

Once your box is created, go to your boxes tab and click the pencil in the corner of the box, now select ‘move to wall’

movetowall

walltab

Some good examples of FBML content can be seen below:

Adidas have used a Wall Box as a promotional tool
Adidas have used a Wall Box as a promotional tool
iTunes have created a whole tab of Static FBML boxes with a unified style.
iTunes have created a whole tab of Static FBML boxes with a unified style.