Blogger Ever

Integrate Facebook comments box with Blogger - 2014

With this new 2014 tutorial you can integrate your Blogger blog with Facebook Comment Box. There are many advantages of using FB comment box. Further you can easily moderate them using your Facebook account.
Integrate Facebook comments with Blogger

Facebook comments plugin are going well due to more social experience. You can moderate comments like other commenting systems as well as you can make your Facebook friend as a comment moderator. Further there more advantages of using them are listed in the post.

Where to start?

Like other Facebook plugins you should have a Facebook account and a Facebook application. You can create facebook application very easily by using the following procedure.

Create a Facebook app

  • Go to Facebook Developer's page
  • Click Apps and Add a new app (as shown):

click on add a new app button

  • Now select Website in popup menu.
  • Now name your app, maybe your blog name or something you like.
  • Then click Create a new app id.
  • Now select the category and make Is this a test version of another app? remain to No.
  • Then click confirm.
Now your app is half created, now you have to provide relevant information related to your blog, as demanded that is your blog URL and mobile URL, in both of them put the same URL i.e your blog URL.

You'r done with your app, but it will not work until you make it public. So to make public it is necessary to add email address. So follow the steps below to add email and make your app public:
  • Click on the apps in navigation.
  • Click on your app.
  • Go to settings in left sidebar (as shown):
Click on settings

  • In settings write your email address in Contact Email field.
  • Click save changes.
  • Now go to Status & Review on left sidebar.
  • Now just set your app to public by clicking on the toggle button.
Change toogle button to yes
After setting it to yes, click Confirm on popup menu. Then you can see an App ID on your screen copy it somewhere as it will be used in further process.

Whats Next?

Now you have to make a comment plugin using Facebook Comment Plugin page. This is something ready-to-eat plugin, all you have to do is to:

  • Do not fill any field just click on get code.
  • Now select your app your created in the popup box, it is a necessary step do not leave it.
Now you can see two codes, copy the above one and go to Blogger > Template > Edit HTML, find <body> in the template and paste the code right after it.

Now find <b:includable id='comments' var='post'> and paste the following code just below it.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="fb-comments" expr:data-href="data:blog.title" data-numposts="5" data-colorscheme="light"></div>
<center>FB Comments Tutorial By <a href='http://bloggerever.com' target='_blank'>Blogger Ever</a></center>
</b:if>
Now find <head> and paste the following code just below it:
<meta content='YOUR_APP_ID' property='fb:app_id'/> 
 Replace YOUR_APP_ID with your App Id you noted before.

How to moderate comments

As I said it is very easy to moderate comments. Just go to Facebook Comment Moderation tool and you can see the latest comments on your blog.

Advantages of using Facebook Comment Box

  • Facebook have about 1 billion registered users.
  • It makes easy to comment while logged in to Facebook
  • The comment sometimes get shared on commentator's wall.
  • Others can like the comment and your post will get a social boost with every like and comment.
Blogger

2013-2016 Copyright Blogger E\ver . Coded, managed and founded by Mohammad Hamza (@hamzadhamiya) . Hosted on Blogger and fonts used are Raleway and Open Sans.