Tutorial: The Facebook fan page squeeze page

Tuesday, December 21, 2010

Tutorial: The Facebook fan page squeeze page

Tutorial: The Facebook fan page squeeze page

What is a squeeze page?

A squeeze page is the first page user sees when they click on your marketing link. It is designed to drive home a sale, or in our case to get the user to click on the "Like" button. In facebook by default the first page a user sees when they go to your page is the wall application. In order for more users to like your page it is absolutely essential that you change this to a more attractive page.

So here is a little tutorial we have put together because we want to help you have the most successful page possible so that you keep coming back!

What is a squeeze page?

A squeeze page is the first page user sees when they click on your marketing link. It is designed to drive home a sale, or in our case to get the user to click on the "Like" button. In facebook by default the first page a user sees when they go to your page is the wall application. In order for more users to like your page it is absolutely essential that you change this to a more attractive page.

So here is a little tutorial we have put together because we want to help you have the most successful page possible so that you keep coming back!

Step 1 - Install The Static FMBL Application

The FBML application is a great little application that you can install on your page to show your own HTML code.

To install this app click on the edit you page link:

In the edit screen scroll down to the "More Applications" section and click on Static FBML::

Then click the add to my page button:

Then click the add to page button below

So now we have FBML installed we need to configure it and code up the page. Head back to your page and click on Edit Page once more.

Then click the "Edit" button in the new FBML application section.

The box title you give you page has to be short and sweet or the text wont fit. Pick something straight to the point, but something that will get the users attention.

Now here is where the magic happens. The following is the code for our own KFC page that we put together as a demonstration of what we can do with a simple page. Some of the text is hidden from the users until they have clicked like and it is set out in such a way that it shows users that they will get the juicy bit of information once they click like.

The trick here is the "<fb:visible-to-connection>" and the "</fb:visible-to-connection>". Any HTML between them is hidden. If you are a band or an artist or any one with some HTML from your site that you want to show you can throw in HTML directly from your sites source code as we have done with our own facebook page for this site to your right.

Just in case you want to see how the whole code hangs together here it is in all its glory.

Now you have FBML installed you need to configure it. The first thing you should configure is the settings that tell Facebook which page to show your users first. Right now this is set to your wall, to show off the funky squeeze page were about to make you should set the new FBML tab to be the first page. To do this click the Edit Page link like we did before.

<STYLE TYPE="text/css">
#wrapper
{ width:520px; margin:0 auto; border:0; padding:0; position:relative; }
#non-fans
{ width:520px; position:absolute; top:0; left:0; }
</STYLE>

<center>
<img src="http://ezs335fa370baf692e63b96c2b7a0162d060.s3.amazonaws.com/GoogleSwitchReport/FBarrow1small.png">
 

Want to learn to cook KFC original recipe chicken at home?!
 Secrets are revealed below!

 
 
<img src="http://ezs335fa370baf692e63b96c2b7a0162d060.s3.amazonaws.com/GoogleSwitchReport/FBarrow2.png">
 
Why is the colonels 11secret herbs and spices so damn delicious?! Why hasn’t anyone managed to replicate his recipe? After months of testing I have found the secret! If you have "Liked" this page you will see the recipe bellow! </center><fb:visible-to-connection> 
1 Beaten Egg
2 frying chickens with skin cut up into 6 pieces
2 Cups of Milk
2 Cups of flour
6 Cups of Cooking Oil
2 teaspoons of black pepper
1.5 teaspoons of Accent Flavor Enhancer
3.5 tablespoons of salt
 
<ol> 
<li style="text-align:left;">Put oil in a pressure fryer and heat on medium to 400 degrees</li>
<li>Combine egg and milk in a bowl</li>
<li>Combine remaining ingredients in a second bowl</li>
<li>Dip each chicken piece into the milk and egg mix until its fully moist</li>
<li>Roll the chicken piece in flour mixture until completely covered</li>
<li>Carefully drop the chicken into the pressure cooker... WITHOUT burning yourself</li>
<li>Cook for 10 mins</li>
<li>Release the pressure, remove chicken and sit on a rack or paper towels.</li>
</ol> 
11 herbs and spices my ass!</fb:visible-to-connection>

 
 
</div>