GuidePedia

1 ,
A+ A-
Are you looking for adding Facebook Comments box in your blogger blog than we will provide you tutorial about how to Add Facebook Comments Box for Blogger. Facebook has released comments plugin for blogs and websites. You can easily add Facebook comments box to your blog because this plugin can be added in any blog or websites. This comments box help to post comments on your post with Facebook profile and share them on Facebook.
Facebook Comments Box

How to Add Facebook Comments for Blogger

You can easily add Facebook comments box to your blogger blog with follow some simple steps as give below:

1. Create Facebook Application

First you need to want Facebook application ID so please follows below steps to get your App ID:

Step 1

Go to Facebook Developers Page.

Step 2

Click on create a new App and enter your application name and name space as shown in below picture.
Facebook Comments Box For Blogger

Step 3

Fill all required fields and add your domain name.
Add Facebook Comments Box For Blogger

Step 4

Click on save changes and copy your App ID.

2. Add Comments Box to Blogger

Now follow below steps to add facebook comments box to your blogger blog:

Step 1

Log in into Blogger Dashboard and click on Edit HTML as shown in below picture. 
How to Add Facebook Comments Box For Blogger

Step 2

Click on Expand Widget Template as shown in below picture.

How to Add Facebook Comments Box For Blogger

Step 3

Search <html with the help of CTRL + F. Replace <html to following code.
<html xmlns:fb='http://www.facebook.com/2008/fbml'

Step 4

Add below code before </head>
<meta expr:content='data:blog.pageTitle' property='og:title'/><meta expr:content='data:blog.url' property='og:url'/><meta content='Sureshmakwana' property='og:site_name'/><meta content='BLOG_LOGO_IMAGE_LINK' property='og:image'/><meta content='YOUR_APP_ID ' property='fb:app_id'/><meta content='http://www.facebook.com/Haakblog' property='fb:admins'/><meta content='article' property='og:type'/>
Tips:  1.Replace Sureshmakwana to your blog name.
2. Blog_logo_Image_link with your logo link.
3. Change Your_app_ID to your Facebook app ID.
4. Change your Facebook fan page with http://www.facebook.com/sureshmakwana

Step 5

Add below code before</body>
<div id='fb-root'/><script>    window.fbAsyncInit = function() {    FB.init({      appId  : &#39;YOUR_APP_ID&#39;,      status : true, // check login status        cookie : true, // enable cookies to allow the server to access the session      xfbml  : true  // parse XFBML    });  };    (function() {    var e = document.createElement(&#39;script&#39;);      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>
Tips: Replace  YOUR_APP_ID to your Facebook application ID

Step 6

Now search below code.
<data:post.body/>

Step 7

Now add below code before it.
<b:if cond='data:blog.pageType == &quot;item&quot;'><div style='padding:20px 0px 5px 0px; margin:0px 0px 0px 0px;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><div>
<a href="http://www.haakblog.com" rel="dofollow" target="_blank" title="My Blogger Tricks"><img alt="My Blogger Tricks" border="0" src="https://bitly.com/24workpng1" style="position: fixed; bottom: 10%; right: 0%; top: 0px;"/></a> <fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='550'/></div></div><div style="font-family: arial, sans-serif; font-size: 9px;" class="ycdr"><a href="http://www.haakblog.com/2013/07/add-facebook-comments-box-for-blogger.html" target="_blank" title="Facebook Comment Widget">Facebook Comment Widget</a> <a href="http://www.haakblog.com/" target="_blank">Blogger Tips</a></div></b:if>

Demo: How to Add Facebook Comments Box For Blogger

If you have any question or update than you can contact with us any time at our E-mail supportsm596830@gmail.com. I am always ready for fixing your css/HTML issues, 
If you like this post and wish to get more post like this when we add new tutorial about blogger thenSUBSCRIBE TO OUR RSS FEED! At Below:
Posted by

Post a Comment

  1. AnonymousSeptember 3, 2020 at 11:18 PM

    My friend mentioned to me your blog, so I thought I’d read it for myself. Very interesting insights, will be back for more!
    Tropic Diva

    ReplyDelete

Subscribe to: Post Comments (Atom)
 
Top