nazly.me

Weblog of Nazly Ahmed

Nazly Ahmed

Nazly Ahmed

Web Developer. PHP Addict. Wordpress Hacker. FOSS Enthusiast. (Micro)Blogger. Photo Hobbyist. Cricket Fanatic. Husband. Dad.

A Facebook Page is a vital part of Social Media Marketing. One of the key features in a Facebook Page is the ability to add a custom Tab. Page owners can use a custom Tab to provide valuable information. On these Tabs, most of them provide content/information only to the users who have Liked their page. If this strategy is used effectively, the fan base of the Page will grow significantly. My primary focus is how we could technically provide the content based on the fact whether the user has Liked the page or not.

Doing this using Legacy FBML code is very simple. The following code will display different HTML content based on whether the user Likes the page or not. If the user doesn’t like the page, a message to Like the page will be displayed. If the user Likes the page already, the full content will be displayed.

<fb:visible-to-connection>
    Show content to the user
    <fb:else>
        <div style="position:absolute; top:0; left:0;">
               Like the page inorder to view the content.
        </div>
    </fb:else>
</fb:visible-to-connection>

But the case is not that simple because Facebook has deperecated the use FBML since March 2011. This is what Facebook has to say.

We are in the process of deprecating FBML. If you are building a new application on Facebook.com, please implement your application using HTML, JavaScript and CSS. You can use our JavaScript SDK and Social Plugins to embedded many of the same social features available in FBML. While there is still functionality that we have not ported over yet, we are no longer adding new features to FBML.

While looking at alternate methods to get this feature working, I came across a very easy solution. If you are good with a server-side scripting language like PHP, this solution is for you. Of course you should build your own Facebook application and create a custom Tab in your application which could be added to a Page.

Goto the Facebook Developers Page and create a new application. Fill in the necessary fields and Save the changes. The URL entered on the ‘Tab URL’ field is the location where Facebook will fetch the content when the Tab is clicked. Technically this is where your script will be hosted. Now add the App you created to your Facebook Page. You will see the Tab visible on your page. Create a PHP page with a Hello World message in the URL you provided as Tab URL. When you cick on the Tab, if you see the Hello World message, then its time to write our script.

When Facebook requests our script, we need to extract the signed_request that comes along with the request. To do that we will need the Facebook php-sdk. Download, extract it and copy the src directory to the location where your script is. Here is the script that will provide content based on whether the user Likes the Page or not.

<?php
require 'src/facebook.php';
 
// Create our Application instance (replace this with your appId and secret).
$facebook = new Facebook(array(
  'appId' => '2324983201930103',
  'secret' => 'f5wjeu72hmxjf981da84jpwo02sdvge3',
));
 
$theRequest = $facebook->getSignedRequest();
 
if($theRequest["page"]["liked"] == 1){
    echo "The real content";
}
else{
    echo "Like our page to view";
}
?>

Happy Coding!

Posted on 24th July 2011 21:41:53