If you are an admin of a Facebook fan page, you’ll know that there aren’t many ways to customize a fan page with only its default applications. Although you can post different types of content, the design of and layout of your page is the same as a regular Facebook profile. Creating a Facebook landing page will help your fan page stand out.
There are several Facebook applications you can install on your fan page that will allow you to create a customized landing page. These pages can be used to encourage viewers to become a fan of your page, promote products and deals, or provide coupons or other incentives.
Here are some examples of Facebook pages with customized landing pages:
Here are the steps to follow to create your own Facebook landing page:
1. Add the Static FBML application
The first thing to do is add the Static FBML application. Static FBML allows you to add advanced functionality to your page. It’s basically a blank canvas to which you can use HTML or FBML (Facebook Markup Language) to create a mini-webpage right on your fan page.
Upon clicking “Add to Application,” select the page you’d like to add Static FBML to and click “Add to Page”.
2. Add content to your Facebook landing page
After adding the application to your pace, click “Edit Page” below your page’s profile image. Scroll down to the FBML application and click “Edit”.
The “Box Title” will be the name of your tab. The main text field is where you can add content and standard HTML. Just like any website, you can add images (hosted elsewhere), text, links, and other formatting. Do not add HTML, HEAD, or BODY tags.
3. Set up a tab for the landing page
Click “Edit Page” below your page’s profile image. Scroll down to the FBML application and click “Application Settings”.
Each FBML page can function as a full tab (which we’re doing here) or a box in the left-hand column of your page’s wall tab. When creating a landing page, make sure the “Tab” setting is added and the “Box” setting is removed.
4. Make the FBML tab the default landing page
If you want this customized tab to be the default landing page, so that it’s the first thing a new user sees upon entering your fan page, go back to your page settings and select “Wall Settings”.
In the “Default Landing Page for Everyone Else” dropdown, select your new custom FBML tab.
5. Test your new FBML tab
Make sure that your FBML tab looks right. To make sure that your FBML page appears as the default tab for non-fans, log out of Facebook and visit your fan page.
Have you created a customized Facebook landing page for your Facebook fan page? Showcase yours by linking to your fan page in the comments below!
Comments on this entry are closed.
{ 12 comments }
Great post, with very helpful graphics!
Yesterday I posted a pretty thorough FAQ for Static FBML which your readers might find useful.
Also, your readers should know that Facebook intends, in “early 2010″, to reduce the width of application tabs (such as Static FBML) from the current 760 pixels to 520 pixels. So designers/coders might want to just start designing at the reduced width to avoid having to redo their tab when Facebook implements their changes.
Cheers, Tim
Hi Tim,
Thanks for your comment! That's a very good point regarding the resize to 520 pixels. The resize was supposed to happen at the end of January, then by March 1st, and things still haven't changed. But yep, it's a good idea to adhere to a 520 pixel width to avoid a redesign.
This is great information! I just started a fan page on FB and was a bit disappointed with the lack of functionality. Will come back here and post a link when I get my new landing page up and running!
This is a great tutorial. Thanks for taking the time to write it up. I'm going to “fan” you on Facebook now, and I look forward to more great info. – Matthew Burgess
Have you seen any way to be notified when someone becomes a fan of a fan page?
Thanks for your comment! Yes, come back and post the link to your FB page, I'd love to see it.
Thanks!
You can check the “Insights” (navigate to it from the left-hand column on your Facebook page) and download the stats by clicking “export data.” This way, you'll be able to see how many new fans your page has each day.
In terms of notifications, Facebook has actually just started sending out weekly emails to all admins of Facebook pages letting you know how many fans each of your pages has acquired in the past week, and how many total fans your page has. But I haven't heard of a way to receive a notification each time you get a new fan… I will update you if I learn otherwise!
Matthew and Diana, “like” your own posts. You'll get e-mails from every commenter.
This is great, but is there any way to create a landing page for people who are already fans?
THANK YOU so much for this excellent tutorial and helpful graphics (I was able to glean an important piece of HTML code from one of the screenshots).
I had this post bookmarked for awhile. Finally put it to use yesterday when I launched my new Facebook biz page: “Art Brand Plan – Branding and Marketing for the Ambitious Creative”
My page is all about links, tips and tutorials regarding to branding, marketing and social media, so you better believe I'll be sending people back to U Stand Out to take advantage of all your excellent resources!
Since you asked, here's how my landing page turned out (now I'm off to get 25 Likes, so I can shorten up that URL!
http://www.facebook.com/pages/Mount-Shasta-CA/A...
Great post Diana..!! Talking about a 520 pixel width design, if fbml supports fluid width then it would be good for designers to use a fluid width structure so that they need not worry about any changes to the content area. It will always be “pixel perfect”