Search code examples
facebookfacebook-javascript-sdkfacebook-social-plugins

Facebook Comment Box not working but worked before

I was trying to implement a simple Facebook social plugin comment box onto my website. The URL of the box is not static, since every post on my site has one of them, but is generated using PHP.

I got it working fine for a while, but suddenly it stopped doing so and now I can't get it back again. I'm not too familiar with Facebook development, so I might've made a mistake in the code.

Here's how I load the Facebook Javascript SDK (I changed some fields for anonymity):

<div id='fb-root'></div>
<script>
window.fbAsyncInit = function() {
        FB.init({
          appId      : MY_ID,
          channelUrl : 'http://www.mysite.com/channel.php', 
          status     : true, // check login status
          cookie     : true, // enable cookies to allow the server to access the session
          xfbml      : true  // parse XFBML
        });

        // Additional initialization code here
      };

      // Load the SDK Asynchronously
      (function(d){
         var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement('script'); js.id = id; js.async = true;

         js.src = '//connect.facebook.net/en_US/all.js';
         ref.parentNode.insertBefore(js, ref);
       }(document));
</script>

And here is how I initialize the comment box:

<script>
    (function(d, s, id) {
          var js, fjs = d.getElementsByTagName(s)[0];
          if (d.getElementById(id)) return;
          js = d.createElement(s); js.id = id;
          js.src = '//connect.facebook.net/en_US/all.js#xfbml=1&appId=MY_ID';
          fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
</script>

<div class='fb-comments' data-href='http://mysite.com/post?id=<?php echo $id; ?>' data-num-posts='4' data-width='470'></div>

Here's channel.php:

<?php
header("Pragma: public");
$cache_expire = 60*60*24*365;
header("Cache-Control: max-age=".$cache_expire);
header('Expires: ' . gmdate('D, d M Y H:i:s', time()+$cache_expire) . ' GMT');
?>
<!DOCTYPE html>
<script src="//connect.facebook.net/en_US/all.js"></script>

I pasted the scripts at the end of the page in the body. Right now, nothing is showing up at all— no errors, just blank. Any help about getting this to work would be greatly appreciated.

Solution

  • Sorry guys, but the whole thing was caused by a stupid mistake of mine: I had a Firefox addon that was blocking the commenting box. It actually works fine. I apologize for my mistake.