Creating A Custom Facebook Fan Page

• Tweet
• Email

• Tweet
• Email

I’ll bet you’ve already recognized the value of having a presence on Facebook. If not, you should definitely read this.

When I set out to take our fan page beyond the generic layout to something more custom, I knew I needed to research FBML. I was worried I might be getting in over my head.

In truth, a custom Facebook page can be as simple or complex as you’d like. Many fan pages are very elaborate and interactive. Within FBML, you can insert basic HTML, CSS, and Javascript. But complex isn’t necessary. The main idea is that a custom fan page allows you to extend your brand with your Facebook presence.

Some tips for creating custom Facebook fan pages:

Find Inspiration
Take a look at some big brands like Adidas, Gap, and Red Bull.

Take a look at customfanbookpage.com and Facebook Showcase for more great examples.

Design Your Layout
You can use any html app like Dreamweaver, RapidWeaver, or Coda. If you’re an HTML stud, Notepad, Text Edit, or Text Wrangler will do the trick. Your design should be no wider than 760 px. You can integrate CSS, JavaScript, or Javascript if you’d like. You’ll need to check this page for more advanced development.

Add The FBML App
First, you’ll need to install the FBML app. Install the app here.
After you’ve installed FBML, go to your fan page and click the edit link directly under your profile picture.
Scroll down to applications and find FBML.

Click edit and enter a title in the Box Title field. Copy and paste the HTML generated from the design you created (copy everything within the body tags) and save.

Set Where Your FBML Page Will Appear
On your Page’s main page, click “Edit Page” under the profile picture.
Locate the FBML application (it will be called whatever you entered into the Box Title field, plus “FBML”), and click “Application settings”.
Make sure “Box” and “Tab” are selected and click “okay”.
On your wall, click on the tab with the double arrows (at the top of the center column) and select “Boxes”

On the boxes page, click the edit button on the box you just created and select “Move to Wall tab”.

You’ve now created your new custom page.

If you want, you can set this new custom tab to be the default landing page.
Click the edit button under your profile picture.
Go to “Wall Settings” and change “Default Landing Tab For Everyone Else” to the tab you just created.

When someone comes to your page, this is the first page they’ll see. (as the page administrator, you’ll still see the wall page as the default landing tab. In order to see what a visitor sees, you’ll need to logout and go back to the page)

You’ve just created your custom fan page. You can take a look at the custom page I’ve created by going here.

If you want the FBML I created copy this code.

Related posts:

1. Customizing facebook fan pages Are you keeping up with the joneses?   In today’s...
2. The Death Of The Microsite Facebook wins again!...
3. Facebook GUI PSD Kit Smashing Magazine is releasing a free psd file for Facebook...