The previous post on Facebook comments box did not replace your blogger comment form but if you wish to completely remove the blogger form and use this new plugin then steps are even more simple. However I may assure you one important thing here. I am soon going to publish a script that will automatically count and display Facebook and blogger comments beautifully and will show only one form at a time. For the time being apply this new trick.
Replace Blogger Comments Form With FB Comments Box
All the steps are exactly the same as mentioned in the earlier tutorial except step#7
1. Instead of searching for this code,
<b:includable id='comment-form' var='post'>
Search for this code,
<data:post.body/>
2. Just after it, paste the same code we used earlier as shown 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://www.allblogtools.com/' style='text-decoration:underline; color:#fff;' target='_blank' title='blogger templates'>AllBlogTools.com</a></b> Enhanced by <b><a alt='blogger widgets' href='http://www.mybloggertricks.com/' style='text-decoration:underline; color:#fff;' target='_blank' title='Blogger Widgets'>MyBloggerTricks.com</a></b></div></div>
</b:if>
- 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
3. Save your template
Hide or Pop-up Blogger Comment Form
Here you have two options. Either you can,
- Hide the comments box but not the comments. The box will appear only when visitors will click the Post comment link. or
- Hide both Blogger comments and comments box
For the first option:
A pop-up link will display both Facebook and blogger comments but will hide the Blogger comment form as shown below, SEE DEMO ALSO
To do this go to Blogger > Settings > Comments and in the comment form placement option choose the pop-up option as shown below,
Save and you are done!
For The Second Option:
If you wish to hide both blogger comments and the comment box? In that case, set comments to hide
As mentioned by Blogger Hiding the comments will not delete them but temporarily hide them from visitors.
Hit save and you are done again!
What to Do Hide or Popup the form?
The best SEO and productive advise that I can give is that you may hide the Blogger comment box only but you must display blogger comments and give users the chance to comment with any platform they may like. In short the popup option is the best. Blogger comments are crawled by search engines and they are an important part of your content so its better that you don't hide them.
With coming days I will come up with more tweaks related to this brilliant traffic gifting Facebook plugin and will try to make it more blending with some customization tips.
You must know:
- 7 advantages of facebook comments Form
If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »
Thanks To You About That ..................
ReplyDeleteI have a Question. If you Can Then Kindly Answer it ..........
If You Can Then Kindly Write a good Article about Backlinks ?
yhanks
Hi Mohammad This is a killer post thanks for sharing
ReplyDeleteregards
hackerstips.tk
I think the Code should be data:post.body instead of data:pos.body what you have given. Anyways my problem is in my Template there are two data:post.body So under which one should I paste?
ReplyDeleteAkshay
ReplyDeleteThanks for reminding buddy. I have corrected the code. Choose the one close to which you find items near your post titles or items below posts.
Hi,
ReplyDeletei have done all the steps but in the end after i click save i got this msg :
XML: Attribute "xmlns:fb" was already specified for element "html".
what should i do, can you guys help plz ?
Thank you so much for this tutorial. Everything is working as expected, except in one regard (just a minor annoyance, really). Why does an error message occur "Warning http://__________.blogspot.com/2011/07.testing-2.html is unreachable." appear?
ReplyDelete@Ziad
ReplyDeleteThat means you are adding the code twice there. Please go check that code and see you are adding the code after <html only once
@Gryphon
Where do you get this error? In facebook box or while saving your template?
The URL has no proper address and does not exist. Make sure you add the box in your active blog
Hi again Mohammad..
ReplyDeletethanx for you answer,that's right i checked my template i find the code added after <html already,
how can i fix it in order to add facebook comment box ?
thnx for you help
best regards
@Ziad
ReplyDeleteSee that this code is added only once:
xmlns:fb='http://www.facebook.com/2008/fbml'
Delete the repeated one and save your template. The plugin will work just fine.
thanks so much for this tutorial! Amanda @Disney Go To Girl .com www.Disneygotogirl.com
ReplyDeletesomebody tell me that how to moderate these comments without app id.
ReplyDeleteI also tried the standard procedure to add comments according to April 11 instruction release by facebook. the comments box was added but all comments were appearing on all pages :D
Its Not Work In my Side
ReplyDeleteDoes anyone know any code that would allow these facebook and blogger comments to always be shown with each post - without having to click on the 'comments' link?
ReplyDeleteFangoooo
ReplyDeletesorry for my english can you tell me how to put tabs in the comments, facebook / blogger, like this image demo please?
ReplyDeletehttp://2.bp.blogspot.com/-CF9og_u_Bh4/TneBOgmqhMI/AAAAAAAACj4/LI3QMWyQnmE/s1600/Image%2B1.png
how can I make it appear on homepage also, not only when you go to post itself?
ReplyDeleteYou Know I Can't Even Find
ReplyDeletenor
What Should I Do ?
Blog URL : http://roverit.blogspot.com/
@Neeraj Grover OH Sorry I Found It Forgot To Expand The Widget Templates !
ReplyDeleteThank You
Hi Mohammad,
ReplyDeleteI can't find in my code
I'm using the new blogger interface.
I really like this. It works great, but I have one question. It only appears if someone clicks the title to the blog. It doesn't automatically show up at the bottom of the post. If you visit my site www.peridotdynasty.com you will see what I mean. I want it to be above my sharing buttons, but it is not.
ReplyDeletenice post...your blog is awesome..iam also blogger and i apply many tricks on my blog by reading your post..thnx. check my blog http://newsboxblog.blogspot.com
ReplyDeleteHey i jst used this trick but there is some problem created that is i select radio option from show to hide, then both of the comment box has been hidden... please resolve this.. http://sptricks.blogspot.com
ReplyDeleteThanks for such an interesting article as I'm considering replacing my blogger comments with facebook connect. Can you explain why you haven't done this with this very blog?
ReplyDeleteHi Mohammad,
ReplyDeleteThanks for the interesting article.
Just a question, does your Facebook Comments code work for the dynamic views that Google just introduced recently?
The link shared by "Unknown" is engaged in Spam and Phishing activities. Proceed at your own risk.
ReplyDeleteThe link shared by "EasyWay" is just a referral link to Facebook which in short has nothing to do with the tutorial.
--
Sam Bot
realy good tips, I also would lke to share more on my blog http://oyaah.blogspot.in
ReplyDeletehi i tried to get app from facebook as you said but it is showing differently than you explained and i tried all the codes but it is not displaying on my blog
ReplyDeletewww.vaabrobotics.blogspot.com
ok i have the facebook comment box but still shows my blogger one, and when i press hide or open in new window the whole facebook comment box disapears :(
ReplyDeletei have done it :) thanks nice one
ReplyDeleteThank you for your great tips. i got lots of information.
ReplyDeletenot working.......... when iam searching for "". it gives me more than one , where to put. plz help me.......
ReplyDeletehey Plz Help any one...... data:post.body occurs 3 times where to put the code.....
ReplyDelete