How To Create A Facebook Tab For Free

How-To-Create-Facebook-TabFacebook now allows a custom tab to be created for any page. Remember, profiles are for individuals and pages are for brands like Chick-fil-A, Compassion International or an artist like me.

When fans “like” a page the brand is able to message them. That’s the purpose of most pages – to establish contact between the brand and its fans. I’m taking a slightly different approach. Sure, I’d like to be able to communicate with fans but I think I do that best via e-mail, my blog, and in person at concerts. So I’ve built a tab on my page pointing people in those directions. Here’s how I did it.

Design

Facebook limits Facebook tabs to 520 pixels in width. Using Photoshop I designed a tab that borrowed from and mimicked the excellent design work Brad Ruggles and Barton Damer did on shaungroves.com. This way branding is consistent at home, Twitter and Facebook.

I kept the design very simple – rows that could be easily sliced up later. Here’s the design in Photoshop with the guides for slicing marked by blue lines.

How-To-Create-A-Facebook-Tab-Slices

Tabsite Table

After slicing the design into 13 smaller images, I opened a free TabSite account. The free account places an add at the bottom of my tab on Facebook, limits the number of sub-pages that can be created in my tab, and limits the amount of storage space I have available when uploading images to TabSite.

Once following the easy directions to link TabSite to my Facebook account, I built my tab by first going to the “TabSite Manager” and uploading my 13 images. TabSite Manager is a WSIWYG editor. In the editor I clicked the “table” button to create a table. I told it I wanted a table with 1 column and 9 rows.

How-To-Create-A-Facebook-Tab-Table

Next, I inserted each image into its row in the table.

How-To-Create-A-Facebook-Tab-Insert-Images

When two images needed to go side-by-side in a row a little coding was needed – and provided by my web guru Ben Stewart. I highlighted each image in a pair one by one, clicked on the “link” button in the editor (looks like a chain link). When the link menu popped up I chose “Advanced” and entered a bit of code that includes the width of each image.

How-To-Create-Facebook-Tab-Advanced-Image

While I was in the link menu I entered the URL I wanted each image to link to.

How-to-Create-Facebook-Tab-Image-Linking

Publish

When I was done linking all the images, I just hit “Save and Post To Wall.” Then I went to my Facebook page and set the new tab to be the default landing page for anyone visiting my page who has not “liked” it yet.

Here’s the finished Facebook tab, created quickly and for free.

How-To-Create-Facebook-Tab-Finished

Got a better way of creating a Facebook tab? Tell me about it.