Latest

6/recent/ticker-posts

Header Ads Widget

Get Job Vacancy Notice, Download Syllabus and More Job Related.

How to Add Facebook Comment Box on Blogger?

ADVERTISEMENT
ADVERTISEMENT

More Stuff


Facebook Comment box helps visitors to comment on your blog via their Facebook account. Every person have Facebook account and they feel easy to comment using it. Facebook comments helps to increase site traffic.

Follow the instructions below to add Facebook Comment Box on Blogger Blog.

How to add Facebook Comment Box on Blogger?


STEP 1 : Create App with Facebook Account for Facebook Comment Box.


We have to create app on Facebook. It is Simple and easy. Follow this post.

to go on Facebook Developers.

Click on Add a New App.
How to Add Facebook Comment Box on Blogger?


Fill Form with Display Name and Contact Email and Click on Create App ID.
How to Add Facebook Comment Box on Blogger?


Change app review status to Yes with Provide category.
How to Add Facebook Comment Box on Blogger?

How to Add Facebook Comment Box on Blogger?



Your Facebook App is ready. Note your App ID to use.
How to Add Facebook Comment Box on Blogger?


STEP 2 :  Add Facebook Comment Box on Blogger.


Login to your blogger account and open that blog where you want to  Add Facebook Comment Box.

Go to Themes > Edit HTML
How to Add Facebook Comment Box on Blogger?


CTRL+F to find  <html and Paste code below just after <html
How to Add Facebook Comment Box on Blogger?

xmlns:fb='http://www.facebook.com/2008/fbml'

Now Search <head> and paste below meta tags just below <head>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='SangitabBlog' property='og:site_name'/>
<meta content='Facebook App Id' property='fb:app_id'/>
<meta content='http://www.facebook.com/SangitabBlog' property='fb:admins'/>
<meta content='article' property='og:type'/>

Customize :
Replace
SangitabBlog with your Blog Name
Facebook App Id with your Facebook App Id
http://www.facebook.com/SangitabBlog with your Facebook Fan Page.

If you have not fan page you can give your own profile link there.

Again Search for <body and paste given code just below it as shown on Image.
How to Add Facebook Comment Box on Blogger?

<div id='fb-root'/>
<script>
    window.fbAsyncInit = function() {
    FB.init({
      appId  : &#39;FB APP ID&#39;,
      status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the   session
      xfbml  : true  // parse XFBML
    });
  };
    (function() {
    var e = document.createElement(&#39;script&#39;);
      e.src = document.location.protocol +   &#39;//connect.facebook.net/en_US/all.js&#39;;
    e.async = true;
      document.getElementById(&#39;fb-root&#39;).appendChild(e);
    }());
</script>
Replace FB APP ID with your Facebook App ID.

Now you have to determine where you want to place your Facebook comment box. Here is common place to add facebook comment box.

Find
<b:include data='post' name='post'/>

Paste code below just after above code.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div>
<fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='100%'/></div>
</b:if>

To Add Facebook Like and Share Button Add following code.
<div  class="fb-like"
  data-share="true"
  data-width="450"
  data-show-faces="true">
</div>


ADVERTISEMENT
If You are going to Post a Comment, Please keep in mind that all comments are moderated and only comments that are relevant to the post topic will published. Let's have a meaningful conversation relevant to the post topic. THANK YOU. Check privacy policy HERE .

Post a Comment

2 Comments

  1. This is a good post. This post gives truly quality information. I’m definitely going to look into it. Really very useful tips are provided here. Thank you so much. Keep up the good works fbvidmate

    ReplyDelete