Facebook Comments For Blogspot

My colleague had written some code so that his blog visitors can add comments on his blog post using Facebook account. He told me the procedure but it was not handy cause at the end of every blog post need to paste some code. Y'day at noon i just got bored from daily work & thought of fb commenting came in my mind & searched for something which allows to comment on blog post using Facebook easily. Many times i messed cause nothing was straight forward. Finally i gone through many blogs & done it.
I'm writing this blog post in a simple & easiest way so that bloggers will get it. I have explained in simple words for non developers cause real bloggers are non-developers, i don't mind if developers also check & implement.
Relax guys..! its an easy..! not a big deal. Please go through the following 3 straight forward steps if you want to allow your blog visitors to comment using Facebook account. After all its good idea to let your blog visitors comment using facebook cause now a days every one using fb daily & therefore your blog will get popular on facebook.
1) Do you know how to create facebook app..?
You know then just create a new app & skip this stage. open this link. Click on Create New App button, a popup will appear. Write app name like amol's blog & continue. Enter correct captach, a form will appear. Add blogspot.com infront of 'Add Domains' textbox. Click on 'Website with Facebook Login', Enter your blogs link in 'Site URL' textbox & save changes.
Copy App ID like this 330763300338577.
2) Add meta Tag Click on templates
Click on templates -> Edit HTML. Add following <meta content='YOUR_FACEBOOK_APPLICATION_ID' property='fb:app_id'/>. Replace YOUR_FACEBOOK_APPLICATION_ID with your App id. E.g <meta content='241008529352104' property='fb:app_id'/> Check this image.

3) Add Facebook Comment
Click on templates -> Edit HTML. Find this code <div class='post-footer-line post-footer-line-3'> in template. (Use the keyboard shortcut Ctrl + F). What you didn't find above code. Okay check Expand Widget Templates & again find it. This time you will get it easily. Paste the following code exactly below the above line.

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

You can change width & colorscheme for facebook comment box.