Facebook fan/business pages provide enormous potential for spreading business, connecting with your customers, engaging your customers, and marketing pretty much anything.  Over the last couple years, the process of creating an effective page has changed quite a lot.  One big strategy to get people to like your page is to show one thing to get people to like it, and another thing once they like the page.  This is essentially the same as building a landing page when trying to sell a product/service online.  This allows you to give incentives for people to like the page and engage with you.  You used to be able to create pages using FBML, but that faded out to iframes.  Additionally, as of October 1, 2011, you now also have to use a SSL (https) URL.  Contrary to what you may think, all of this can still be done relatively easily for free.  This article is accurate as of January, 2012 (in February, Facebook will be getting rid of Facebook App Pages, so this will likely change yet again).  This entire process will take about 5 minutes to do, aside from the time it takes you to design/build the landing page itself.

Step 1:

Create your page.  You can do this by visiting http://www.facebook.com/pages/manage . Click on “Create a Page” in the upper right.  You can also manage existing pages on this page.

Step 2:

Create your landing page.  You will want to create a page and host it on your own server, which will later be iframed into your Facebook page through your Facebook app (see Step 3).  You want to design your landing page such that it is a max of 515 pixels wide, because that is what fits into Facebook.  If it is any wider, the user will have to screen in an iframe, which tends to be a poor experience.  Additionally, it is beneficial to have your landing page show 1 page to users who haven’t liked your page, and another page to users who have liked it.  Checkout McDonald’s Facebook page for example.  To do this, you will want to create a new file with the following code:


require ‘facebook.php’;

// Create our Application instance (replace this with your appId and secret).
$facebook = new Facebook(array(
‘appId’ => ‘APP ID‘,
‘secret’ => ‘APP SECRET‘,

$data = $facebook->getSignedRequest();
<!DOCTYPE html>

<html lang=”en” dir=”ltr”>
<meta charset=”UTF-8″ />
<title>Title of Your Site</title>
<?php if ($data[‘page’][‘liked’] == 1): ?>
<p>This is the content shown when someone likes your page.</p>
<?php else: ?>
<p>This is the content shown before someone likes your page.</p>
<?php endif; ?>

Note: you will need to replace APP ID with your application ID and APP SECRET with your app. secret later on in step 3.

You will want to replace the content in red with what you want as your landing page for people who have already liked your page, the content in green for users who are yet to like the page, and the purple text in the <title> tags with the title of your page.  I typically just make an image that is 520 x 630px or so with my content, and then just vary the content depending on whether the page is liked or not.  Name this file index.php, and then upload it to your server, such as domain.com/facebook/index.php.  Next you will need to download a few files that Facebook created to make this work.

Go to this URL and click “Download as Zip”:

In the “src” folder, you will find 3 files (base_facebook.php , facebook.php, and fb_ca_chain_bundle.crt). Upload the 3 files onto your server, into the same directory as your index.php .  So you should no have these 4 files on your server:

Step 3:

Create an application to interact with your page.  You do this by visiting http://www.facebook.com/developers . You will have to go through and accept the terms/allow access, and then click “Click New App” in the upper right.  You’ll need to choose the app display name and the namespace, and agree to the terms and conditions.  In the next page, these are the fields you want to fill in:
App Display Name: Name it the same name as your Facebook fan page.
App Namespace: Name this anything, keep it short and simple.
Email: Use your contact email.
(Under Page Tab) Page Tab Name:  Put in something like “Like Us!”.
Page Tab URL: This is the page you have hosted that is ifram’ed (domain.com/facebook/index.php).
Secure Tab page URL: Here you have to put a secure (https) URL.  This typically costs money – however, a site called Social Server has a service to satisfy this for free.  In this field, you want to put “https://secure.social-server.com/v2/” (without quotes).
(Under App on Facebook) Canvas URL: Enter the URL of your iframe page, but as a directory.  So using the example from step 2, you want this URL to be domain.com/facebook/ .
Secure Canvas URL: You want to use the Social Server again here, and put in “https://secure.social-server.com/v2/” (without quotes).

Then click Save Changes.  Now what you need to do is connect your app to your fanpage so they can talk to eachother.  To do this, copy this URL:


Replace YOUR_APP_ID with the app ID, which can be found by going to facebook.com/developers and clicking on edit app (the app ID is shown at the top).  Replace YOUR_URL with your page tab URL you filled in above.  Additionally, you need to now go back to your index.php file on your server, and edit the APP ID and APP SECRET pieces at the top.  Your APP SECRET can be found by editing your app (the app secret is just below the app ID at the top of your edit app page).

Step 4:

Go to your Facebook Fan Page now and refresh.  On the left, you should now see a new tab called “Like Us” or whatever you named the Page Tab.  Click on that, and at the top where it says “enter page URL”, enter the URL to your page you want iframed – domain.com/facebook/index.php from the example above.  Then refresh the page.  Make your landing page the default page that users land on when they visit your page.  To do this, go to your Facebook Page and click Edit Information.  On the left, click on “Manage Permissions”, and then by “Default Landing Tab” change it to “Like Us” or whatever you named the “Page Tab Name” in step 3.

And that should be it.  You should now have a Facebook Fan page up and running, showing different content to users who have liked your page and those who haven’t.  You also have full control over the these landing pages, so be creative. Having a unique, attractive Facebook Fan landing page can greatly increase the number of likes your fan page gets.  Here is a video explanation of this process (with a few details left out/changed since the video a bit older and Facebook’s platform has changed since).

If you have any questions or comments, don’t hesitate to comment below and let me know.

The following two tabs change content below.


Web Developer
I write for fun, I travel for fun, and I enjoy learning. I hate sugar-coating things. Understand the world in reality, not by dogma. Question everything.

Latest posts by Patrick (see all)