Learn how to add Facebook comments to wordpress blog

Facebook Comments
Written by Wamiq Ali

WordPress has got a fairly nice commenting system but if your traffic is from the social means then using the default WordPress comments is foolishness. Like suppose you are getting really high hits from the Facebook then using the Facebook comments is the right option for your blog, and the entertainment sites are actually getting really high traffic from the Facebook. This tutorial will help you install Facebook comments plugin to your WordPress blog. After getting the Facebook comments installed , your default wordpress commets section will be removed and instead of those comments Facebook comments will be shown. Which any any logged in facebook user can use to give opinions over your post.

Facebook Comments

Adding Facebook Comments to your WordPress blog:

1- You will need to edit your theme, and for this purpose you can either use FTP and editing the theme files with a good code editor. Or else you can also use default theme editor of the wordpress blog. Thus, login to your blog and go to Appearance>>Editor.

2- You will need to edit single.php file of your theme, Add this code at the end of your single.php and just above <?php the_footer(); ?>

<div id="fb-root"></div>
<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_GB/all.js#xfbml=1&appId=1390481264539379";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

3- (Last Step) This above code added actually serves as the base to call the comments, now, place the below code to call comments anywhere in your blog inside your single.php:

<div class="fb-comments" data-href="<?php the_permalink(); ?>" data-width="500" data-numposts="5" data-colorscheme="light"></div>

This is the code which actually calls the comments to your every post once placed in the single.php, if you don’t know the structure of a wordpress theme and you don’t know that what exactly single.php does to your theme, then kindly read : Learn Components of a WordPress theme.

In the above code you can see data-href attribute, here I have called the url of the post using wordpress api through the_permalink() and thus every time single.php loads the post , the url of that specific post is loaded inside the comments, giving users the opportunity to comment through the Facebook.

About the author

Wamiq Ali

Programmer, Blogger and an Entrepreneur trying to make this web a better place by making others learn for free.

Leave a Comment