June 13, 2016

How to Add Facebook Comment in Blogger

Hello! Good day everyone! This tutorial will guide you on how to integrate Facebook as your Facebook comment unto your blog. Please take note that this Facebook Comment Box will replace the Blogger's Comment Box, so if you don't like that to happen this tutorial isn't for you, if that would not be the case then let's proceed. Please make sure you backup your template before making any changes.



Step 1. Create an app on Facebook Here.


Step 2. Remember / Copy the APP ID, We will be using the APP ID later.


Step 3. Proceed to EDIT HTML.


Step 4.
- Paste this code after <head>
- Replace YOUR_APP_ID_Here with your APP ID

<meta property="fb:app_id" content="YOUR_APP_ID_Here"/>

Step 5. Paste this code after <div class='post-footer-line post-footer-line-3'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<script>(function(d){
 var js, id = &#39;facebook-jssdk&#39;; if (d.getElementById(id)) {return;}
 js = d.createElement(&#39;script&#39;); js.id = id; js.async = true;
 js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;
 d.getElementsByTagName(&#39;head&#39;)[0].appendChild(js);
}(document));</script>
<div style='margin: 20px 0 0 0;'><fb:comments colorscheme='light' expr:href='data:post.canonicalUrl' expr:title='data:post.title' expr:xid='data:post.id' width='900'/></div>
</b:if>