How To Add Facebook Comment Box To Blogger Blogs

Facebook Comment Box is very useful tool for bloggers. You can increasing traffic for your blog and find many fans.Facebook has launched many social plugins for bloggers and web developers and one such is improved Facebook comment box.  So here in this post I will teach you how to add Facebook comment box to blogger.Before getting into the process I recommend you to back up your template and previous comments in blogger wont be visible if you use Facebook commenting system.

Step 1: Visit Facebook developer page and enter your blog name, URL and click on Create application.

Next you copy the App ID and save notepad.

Step 2: Login to you Blogger dashboard and navigate to Layout > Edit HTML and check on Expand Widget Templates. Search for the code <data:post.body/> or <div class='post-header-line-1'/> and paste the code below <data:post.body/> or <div class='post-header-line-1'/> and save the template.

<b:if cond='data:blog.pageType == &quot;item&quot;'>          
  <p align='left'><img alt='' class='icon-action' src='#'/></p>                                                             
  <div id='fb-root'/>                                         
  <script>                                                    
  window.fbAsyncInit = function() {                           
  FB.init({appId: &#39;APPID&#39;, status: true, cookie: true,
  xfbml: true});                                              
  };                                                          
  (function() {                                               
  var e = document.createElement(&#39;script&#39;); e.async = true;                                                         
  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>                                                   
  <fb:comments/>                                              
  </b:if>