Make Facebook a comment box plugin for Blogger | Blogspot
Well, here are the steps:
1. Visit Facebook developer page. Fill the box with your blog name, blog URL and click on Create application button

and then copy the App ID and save it.

2. Login to Blogger
3. Dashboard > Design > Edit HTML
4. Download full template
5. Tick 'Expand widget template"
6. (Use CTRL + F) Find this code <data:post.body/>
7. Copy the following code and paste below it.
Replace the APPID on the code with your APP ID and save the template.
8. After you save the template, Go to settings > comments and then tick 'hide' the comment option and then click save.
1. Visit Facebook developer page. Fill the box with your blog name, blog URL and click on Create application button

and then copy the App ID and save it.

2. Login to Blogger
3. Dashboard > Design > Edit HTML
4. Download full template
5. Tick 'Expand widget template"
6. (Use CTRL + F) Find this code <data:post.body/>
7. Copy the following code and paste below it.
<b:if cond='data:blog.pageType == "item"'>
<p align='left'><img alt='' class='icon-action' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIk4oiSNthUF8QsvU-ySCGcurJkf_sWVl0wy4GO3H8FDYApdew6qQR86I84z4V0_T09iZVtOmgaPa88DcfDn1SZR2xyZK8u9D38sVGD4gkkKsmK1i_p-S7bUAJ3JMqcg8KXPv5bJJ1uOo/s1600/we+love+comments.png'/></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>
Replace the APPID on the code with your APP ID and save the template.
8. After you save the template, Go to settings > comments and then tick 'hide' the comment option and then click save.