Facebook comment box is very useful for for bloggers increase conversations. This tool help to increase our blog trafick. So i will teach you how to add this easily.
- First you visit Facebook Developer Page enter your blog name and URL and create your application.
- Next you copy the APP ID and save it on notepad.
- Next you login to blogger dashboard and navigate to >Layout > Edit HTML and expand width Templates. Search this 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 == "item"'>
<p align='left'><img alt='' class='icon-action' src='#'/></p>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'APPID', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<fb:comments/>
</b:if>
- Next you change APPID on the code with your APP ID from facebook and you can add a image for"#" and save the template.
- Next you need to hide default blogger commenting system. So navigate to Settings > Comments and select hide and save settings.
