Facebook CommentsFacebook Comments system may be a reason of social media success for most of us. It is best among all Facebook plugins for blogging. On the internet you may find many tutorials which may guide you but all those methods work perfect on Blogger with custom domain but when you use Facebook Comments system on Blogger without custom domain due to many country specific domains of a single blog become a problem. Today in this post we will cover how to rectify errors and problems which are due to Blogger’s country specific domains.

Note: I suggest you to take backup of your Blogger template. Because after implementing this comments system your old comments will disappear from your blog.

Facebook Comments

Installing Facebook Comments on Blogger

1. Go to Facebook Developer Page [https://developers.facebook.com/apps/]
2. Then click on + Create New App.

Facebook Comments

3. Now fill a valid App Name and click on Continue.

Facebook Comments

4. Fill Captcha Code and click on Submit Button.

Facebook Comments

5. Now you’ll get App ID.

Facebook Comment Configuration on Blogger

6. Below under Basic info opposite to App Domains fill 17 Blogger’s country specific domains.

blogpost.com, blogspot.ae, blogspot.mx, blogspot.in, blogspot.pt, blogspot.jp, blogspot.ca, blogspot.de, blogspot.it, blogspot.fr, blogspot.se, blogspot.co.uk, blogspot.co.nz, blogspot.com.es, blogspot.com.br, blogspot.com.ar, blogspot.com.au

7. Now under ‘Select how your app integrates with Facebook‘ you’ll find ‘Website with Facebook Login‘ and ‘Site URL:‘ please fill your blog url here.
8. At last click on ‘Save Changes‘ button to save app settings.
9. Now prepare Application and Moderator Meta Tags.

<meta property='fb:admins' content='ADMIN-NAME'/>
<meta property='fb:app_id' content='APP-ID'/>

Example –

<meta property='fb:admins' content='ADMIN-NAME'/>
<meta property='fb:app_id' content='APP-ID'/>

10. Go to Blogger Dashboard ¬> Select Blog ¬> Go to Template tab ¬> Click on EDIT HTML
11. And under <head> paste above meta tag as following

<head>
<meta property='fb:admins' content='VPNazar'/>
<meta property='fb:app_id' content='348446671899960'/>

Note: With out using this meta tag you will not be able to moderate Facebook Comments. And MUST change ADMIN-NAME and APP-ID with correct values.

12. Now in your blog’s template try to find one of the following code

<div class='post-footer-line post-footer-line-3'
<p class='post-footer-line post-footer-line-3'

If unable to find both of the codes then search for following code

<data:post.body/>

13. And Paste following given code just below. Must change App-ID 

Last Update: Tuesday, 18/06/2013
<b:if cond='data:blog.pageType == "item"'>
&lt;div id="fb-root"&gt;&lt;/div&gt;
&lt;script&gt;(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1&amp;appId=App-ID";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));&lt;/script&gt;
&lt;div class="fb-comments" expr:data-href="data:post.canonicalUrl" data-num-posts="10" data-width="470"&gt;&lt;/div&gt;
&lt;/b:if&gt;
</b:if>

14. In this code data-num-posts is number of comments and default value is 10 and data-width with value 470 Comment form width. You may change both variables as per your blog design.

Disabling Blogger’s Default Comments System

If you want to disable Blogger default comment system then please following steps:

1. Go to Blogger Dashboard and select Blog
2. Switch to Settings tab
3. Then click on Posts and Comments tab
4. And see opposite to Comment Location and select Hide option from DropDown
5. Finally click on Orange color Save Settings button given on upper left side.

I believe you’ll be able to use this great comments system on your blog. If still have any query please communicate with your comments.

© Tech Prévue Labs · तकनीक दृष्टा – https://www.techprevue.com