Question

I am trying to create a custom tab for a facebook page and it works perfectly for me in firefox, chrome and internet explorer 8 in both the tab on the page and as a direct link but for others it just doesn’t pick up their like.

Here is my code:

require 'src/facebook.php';

// Create our Application instance (replace this with your appId and secret).
$facebook = new Facebook(array(
    'appId' => 'xxxxxxxx',
    'secret' => 'xxxxxx',
));

$user = $facebook->getUser();


// alternative to the below but only works on the facebook tab itself
$signed_request = $_REQUEST["signed_request"];
list($encoded_sig, $payload) = explode('.', $signed_request, 2);
$data = json_decode(base64_decode(strtr($payload, '-_', '+/')), true);

if (empty($data["page"]["liked"])) {
echo "You are not a fan!";
} else {
echo "Welcome back fan!";
}

if ($user) {
try {
    $likes = $facebook->api("/me/likes/xxxxxxxxxx");
    if( !empty($likes['data']) )
    {
        ?>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            $('#fan').click(function() {
                $('#fan').animate({
                    opacity: 0.2,
                    width: 'auto',
                    height: 'auto'
                }, 1000, function() {
                    // Animation complete.
                    $('#fan').hide('slow');
                    $('#voucher').show('slow');
                });
            });
        });
        </script>

        <a href="#"><img id="fan" src="//www.website.com/facebook/2011/voucher/fans_image.jpg" alt="10% off" style="border:0;" /></a>
        <div style="display:none; position:absolute; top:0; left:0;" id="voucher" >
        <a href="//www.website.com/facebook/2011/voucher/EYE-TEST-DECEMBER-11.pdf" target="_blank"><img src="//www.website.com/facebook/2011/voucher/fb-voucher-dec11.jpg" style="border:0;" alt="10% off" /></a>  <br />
        <p style="text-align:center"><a href="//www.website.com/facebook/2011/voucher/EYE-TEST-DECEMBER-11.pdf" target="_blank">Click here to download PDF version of the voucher.</a></p>
        </div>
        <?php
    }
    else
    {
        ?>
        <img style="position:absolute; top:0; left:0; border:0;" id="all" src="//www.website.com/facebook/2011/voucher/fb_like_page.jpg" width="520" height="304" alt="Click LIKE button to get 10% off." />
        <?php
    }
} catch (FacebookApiException $e) {
    error_log($e);
    $user = null;
    }
}

if ($user) {
    $logoutUrl = $facebook->getLogoutUrl();
} 
else {
    //user isn't logged in so just show un-liked image
    ?>
    <img style="position:absolute; top:0; left:0; border:0;" id="all" src="//www.website.com/facebook/2011/voucher/fb_like_page.jpg" width="520" height="304" alt="Click LIKE button to get 10% off." />
    <?php
    $loginUrl = $facebook->getLoginUrl(array(
        'scope' => 'user_likes'
    ));
}

More Info
The app is not in sandbox mode.

I was thinking that because the app appears in my account settings that is why it is only working for me but if I look at other fan-gated tabs, they don’t have the permissions notification pop up so that can’t be the case?

Answer 1

The persmissions notification is for people explicitly authorising an app which is what you appear to have done. You are showing info to people who have and haven’t authorised your application, not to people who have or haven’t liked your page

 // alternative to the below but only works on the facebook tab itself
 $signed_request = $_REQUEST["signed_request"];
 list($encoded_sig, $payload) = explode('.', $signed_request, 2);
 $data = json_decode(base64_decode(strtr($payload, '-_', '+/')), true);

  if (empty($data["page"]["liked"])) {
  echo "You are not a fan!";
  } else {
  echo "Welcome back fan!";
  }

The code here is what I would expect for people who like or don’t like the page tab. This has nothing to do with authorising your application that sits on that tab. When a user likes your page, you don’t get access to their user id etc, only if they like the page. But your code seems to be using the api to test if a user likes the page. My guess is that your user object is actually null, as the user hasn’t explicitly authorised the application on that page tab. Does that make sense?

So unless they’ve granted access to the app:

if ($user) {
$logoutUrl = $facebook->getLogoutUrl();
} 
else {
//user isn't logged in so just show un-liked image
?>
<img style="position:absolute; top:0; left:0; border:0;" id="all" src="//www.website.com/facebook/2011/voucher/fb_like_page.jpg" width="520" height="304" alt="Click LIKE button to get 10% off." />
<?php
$loginUrl = $facebook->getLoginUrl(array(
    'scope' => 'user_likes'
));
}

$user will be null here and you will be telling people to like your page whether they have or haven’t done so