My old Facebook Comment on blognizend is not working properly same post on each post this one is fix
1. Create a Facebook App click Here
2. Edit this fallowing
3. Save your App ID on a Notepad
4 How to put the facebook comment box
1.Go To Blogger > Design > Edit HTML
2.Backup!! your template is very important
3.Check the "Expand Widget Templates" box
4.Search for <html and just after it give a space and add this code,
xmlns:fb='http://www.facebook.com/2008/fbml'
5.Next search for <body> just after it paste the code given below,
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID',
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('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Replace YOUR_APP_ID with your Facebook application ID that you saved in a notepad.
6.Next search for </head> and just above it paste the following code,
<pre><meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='blogmytuts' 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/Blogmytuts' property='fb:admins'/>
<meta content='article' property='og:type'/</pre>
Make these changes:
Replace blogmytuts with your blog title/Name.
Replace
BLOG-LOGO-IMAGE-LINK with the image link of your logo. Your logo will look good if it is in gif format and having this size -> 40px by 40px . This logo will appear next to your post title on Facebook profiles of your visitors like this,
logo
Replace YOUR_APP_ID with the your Facebook Application ID that you saved in notepad
Replace http://www.facebook.com/Blogmytuts with your Facebook user profile link
7.Now Search for this Again you must be Expanded Widget
<b:includable id='comment-form' var='post'>
Just after it paste the code given below,
<b:if cond='data:blog.pageType == "item"'>
<div style='padding:0px 0px 0px 0px; margin:0px 0px 0px 0px;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div> <fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='520'/></div>
<div style='color:#fff; background-color:#3B5998;border: solid 1px #ddd; font-size:10px; padding:3px; width:510px;'>Facebook Blogger Plugin: Bloggerized by <b><a alt='blogger templates' href='http://blognizend.blogspot.com/' style='text-decoration:underline; color:#fff;' target='_blank' title='blogger templates'>http://blogmytuts.blogspot.com</a></b> Enhanced by <b><a alt='blogger widgets' href='blogmytuts.blogspot.com/' style='text-decoration:underline; color:#fff;' target='_blank' title='Blogger Widgets'>http://blogmytuts.blogspot.com</a></b></div></div>
</b:if>
EDIT if you want:
If you want to use the dark scheme then simply replace light with dark
To change the Comments box size, change this value width='
520'
To change the footer credits size, change this value width:
510px
Keep a difference of 10 pixels between the box size and footer size. For example if you set box-size to width='600' then set footer-size to width:590px
Check and Test
Just Updated in case of fb comment did not show .. check your comment setting in your blog must be embedded..
You may also like to read :
Facebook Comment Box Moderation Guide
http://www.blogmytuts.net/2013/01/facebook-comment-box-moderation-guide.html
