New Facebook Comment Box for Blogger With Notifications Enabled

Shortlink:

Facebook comment for your blog can serve as a good way to make your site more engaging and encourage readers to drop comments if they’re already logged in to Facebook. It also serves as a source of traffic since using Facebook comment shares the comment and post page on the visitor’s Facebook wall. One thing should be noted though: Facebook comment has no SEO value since it’s being displayed in an iframe which Google won’t index. Comments made with the regular comment box on your site has more advantages especially if you get loads of comment, more keywords you didn’t actually mention in the post content but appearing in comments do bring more search engine traffic. This is something Facebook comment lacks, execept the extra traffic you get from Facebook.

I just thought you should know that before you implent it on your blog. As you can see, I do use it too. I wrote a post on this particular topic earlier but Facebook has changed since, lots of things on the post may not look exactly as explained. Also, this one has a feature the previous one didn’t have – getting notified of every comment made on your blog. One other thing, I customized this with a little CSS. Below is a screenshot of what it looks like:

new facebook comment box for blogger with notification

You may also check the live demo on my old blog here.

How to add Facebook comment box to Blogspot

There are about five steps to get this done but chill out, it’s easy, ok? :D Just follow the steps and you’ll have a nice Facebook comment box installed on your blog in no time.

1. Creating a Facebook Application

i. Head on to facebook developer page, you should create a new app by clicking the button at the top right.

how to add facebook comment box for blogger

ii. Enter your application name and namespace,input the captcha code and proceed.

how to add facebook comment to blogger

iii. On the next page, enter your custom domain name (if you’re using a custom domain) or just blogspot.com (if you’re using blogspot sub domain) in the space provided for App domain.

For App website, enter you blog URL. ( http://www.xyz.com/ or http://xyz.blogspot.com/ ). Be sure it starts with http:// and ends with / as shown in the screenshot below:

how to add facebook comment to blogspot

iv. Scroll down a bit and hit the Save Changes button. Now you’re done with creating your facebook application but there’s one more thing to do. On that same page, you should see your application ID. Copy it and save somewhere, you’re gonna be needing it.

facebook comment box for blogspot

Now let’s head to your blog and finish this up ;)

2. Adding the codes to your template

We’re adding four sets of codes into your template to make this work the way we want, aight?

i. xmnls attribute
ii. SDK script
iiI. Open graph meta tag
iv. Comment form iframe code

Log in to your blogger account and click on Template > Edit HTML > Check Expand Widget Template

i. Press Ctrl + F and search for this code:

<html

This should be found on the second or third line of your template.

- Right in front of this, add the following code:

xmlns:fb='http://www.facebook.com/2008/fbml'

-Be sure to have a space before and after this code. Take a look at the example below:

<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog…………..2005/gml/expr' >

ii. Press CTRL + F on your keyboard and search for this:

<body>

If you can’t find this, search for something similar. You should search for this instead:

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

In the next line, paste this code:

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APPLICATION ID HERE',
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>

Be sure to replace YOUR APPLICATION ID HERE with the application ID I asked you to copy earlier, remember?

iii. Now, let’s add the open graph meta tag. Search for this code in your template:

</head>

In the line above it, paste this piece of code:

<meta property="fb:app_id" content="YOUR_APP_ID" />

Replace YOUR_APP_ID with that same application ID you previously copied.

iv. Now here’s the last part of tweaking your template your template to make it display Facebook comment box. The last thing is the iframe to display the comment box where you want. Search for this in your template:

<data:post.body/>

If you’re using a magazine style template, you’re likely to have more than one occurrence of this. Using the wrong one won’t make the comment show up. If you’re not sure about which one to use, search for this instead:

<div class='post-footer-line post-footer-line-1'>

In the line just below it, paste this code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.doncaprio-share-buttons
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border:1px solid #BBBBBB;
background-color:#F2F2F2;
-webkit-box-shadow: #B3B3B3 5px 5px 5px;
-moz-box-shadow: #B3B3B3 5px 5px 5px;
box-shadow: #B3B3B3 5px 5px 5px;
padding: 5px;
margin: 10px;
}
</style>
<p align='center'>
<div class='doncaprio-share-buttons' style='background: #f2f2f2;'>
<font size='6'><strong>Love to hear what you think!</strong></font> <img src='http://geek.ng/wp-content/uploads/2012/08/comment.png'/>
<br/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='450'/></div>
<div align='right'><a href='http://geek.ng/2011/08/facebook-comment-box-for-blogger.html' target='blank'><small>[Facebook Comment For Blogger]</small></a></div>
</div>
</p>
</b:if>

Save your template, the Facebook comment form should now appear. If it looks rather small, replace width=’450′ with width=’600′. This increases the width from 450px to 600px.

3. Enabling notification for comments on every post

This is the last part and it’s optional but I recommend it. Enabling this lets you know whenever someone comments on your blog. You get a regular notification on Facebook and you can visit your blog to reply the comment.

- Visit this URL: https://developers.facebook.com/tools/comments/?id=YOUR_APP_ID

- Be sure to replace YOUR_APP_ID with your real application ID

- On the page that opens, click on settings and add yourself as moderator

facebook comment box for blogger with notification

- Click on your name when it shows up and save the changes you made. When someone drops a comment on your blog, you should be notified that instant on Facebook.

facebook comment box for blogger with notification enabled

If this works for you, you can say thank you by sharing on Facebook, hitting the Google +1 button or simply using the comment box. Also, it would be nice of you not to remove the credit link to allow others find this useful widget. If you’re having problems implementing this as well, don’t hesitate to let me know maybe I can be of help.

Update 1: Showing the Comment Box on the Homepage and Archive

I don’t recommend this because it doesn’t make your blog look neat and professional but if you have to show the comment box on the homepage, there’s only a little thing you must do. See the code you pasted in STEP 2 iv? Yeah, just remove the first and the last line of that code and the box should appear on the homepage below every post.

Update 2: Fix Facebook Comment Box Aligned to the Right

We all know Blogger recently made some changes and I noticed this box got aligned to the right due to some reasons. This seems to be cause by some HTML tags being incorrectly parsed by the new template editor… my guess.

Anyway, here’s the fix: Replace the code you have under data:post.body with the one below.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.doncaprio-share-buttons
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border:1px solid #BBBBBB;
background-color:#F2F2F2;
-webkit-box-shadow: #B3B3B3 5px 5px 5px;
-moz-box-shadow: #B3B3B3 5px 5px 5px;
box-shadow: #B3B3B3 5px 5px 5px;
padding: 5px;
margin: 10px;
}
</style>
<p align='center'>
<div class='doncaprio-share-buttons' style='background: #f2f2f2;'>
<font size='6'><strong>Love to hear what you think!</strong></font> <img src='http://geek.ng/wp-content/uploads/2012/08/comment.png'/>
<br/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='450'/></div>
<div align='right'><a href='http://geek.ng/2011/08/facebook-comment-box-for-blogger.html' target='blank'><small>[Facebook Comment For Blogger]</small></a></div>
</div>
</p>
</b:if>

Replacing the whole code pasted earlier under data:post.body or post-footer-line-1 should fix it. I did it on my test blog and it works just fine. Any problem? Don’t hesitate to holla at me. :)

Peace.

Filed Under: Blogger





Author: Don Caprio

Don Caprio is a full time blogger / web designer living in Nigeria and apart from blogging, my other obsession is music. I'm a self-confessed Tupac fan, an iOS lover, an Android user, a Windows 8 power user, a writer with a 5-year old unfinished novel... and the list goes on and on. You can add me on Facebook, follow my updates on Twitter or add me to your circles on Google+! By the way, if your blog needs a custom design, you can contact me here...

Comments

  1. Emeka Kamanda says:

    Facebook comment box is not working for my blog. I don’t know why. Please help me

    • Don Caprio says:

      I can only assume you’ll use this post and the codes contained therein on your next blog post, like you did on the post appearing in your comment above… the post and code which originally appeared here – Adding Stylish Share Buttons to Your Blogger/Wordpress Blog’s Post

      • Emeka Kamanda says:

        If u’ve read the post u will see that i re-wrote it not to be like urs, though i got d tip from here. But i need assistance on dat facebook comment box. I’ve tried but not working. Pls help

    • it is not work in my blogger too

    • cinemabiled says:

      Hello, I have a request why not make a video tutorial how I can apply the facebook comment box in my blog, because there are many options to put the blog comment box, but the old version of html and that new is a bit more complicated and can not find code that is required to make application on the blog, if you have something that can help me please get on my facebook page and let a private message https://www.facebook.com/ FilmeBiled Thanks Advance!

  2. Edi - The A.J Geek says:

    The Widget is so Cool Bro Don, the Notification feature is on pint, and you made it look awesome by styling it, besides this, I notice you do styling in widgets you talk on your blog these days, seems you’ve added CSS to your skills. Thumbs Up ;)

    • Thanks for the compliment, Edi. Yeah, Ithink CSS is getting more interesting. It feels like Art which I naturally love :D

  3. Its cool Buh i don’t think i want facebook comment boc on my blog right now. Perhaps when i move to WP

  4. Thank done, good to see this simple steps

  5. blogger kibria hossain says:

    I have allready set up facebook comment box to my [url=http://www.e-blog24.blogspot.com]blog.[/url] i think it need to be update from your post. Thanks don

    • Since you already have a facebook comment installed, just replace that with is as explained above: You can replace the comment form with this new one. Just replace the code under

  6. Funsho Kolawole says:

    Thank you sir, for this great share but please what about we that are using the old facebook comment box before. How are we going to remove the old one before installing this new one?

  7. Victor Ome Umukoro says:

    Mine is working perfectly good………saw alot of comment notification on my facebook wall coming from my site……………..good work Don

  8. Victor Ome Umukoro says:

    Mr Don Caprio pls do you any article on this “Get free daily updates through email Subscription Bar”? pls i need it

  9. The instrument is so calm, the Notification component exists on pint, also you caused it appearance large by styling it, additional this, I caution you do styling in instruments you conversation on your blog these days.

  10. thanks for this!

  11. Hi Don, I am fine up to the point where I search for the line No search results. Any suggestions? Thanks

  12. forgot to check the Check Expand Widget Template box. Done and it looks great! Thanks!

  13. Thanks man its cool and i love it.

  14. cholesterol says:

    Can the facebook comment box be removed?

  15. Reddypradeep says:

    Not working for my blog…… message shown like this …… ” Error parsing XML, line 3, column 340: Attribute “xmlns:fb” was already specified for element “html”…..

    • Don Caprio says:

      That’s because you already have a facebook comment installed. You can just replace the code you have under data:post.body with the one I posted. That’s all you need to do.

      • Don, this is a great help. I had the same problem and it seems to be because I already have Facebook “like” buttons installed. Is there is there a work-around where I can keep both?

        • Don Caprio says:

          Hi Evan, If you get this error, simply skip STEP 2 i. It should work.

          • Well, the most bizarre thing happened. I just went back to do what you said, and when I follow your instructions and click on “edit HTML” I get the screen and the scroll bar, but there is NOTHING THERE. No HTML. Yet, the blog itself seems to be fine. Ever seen this before?

          • Don Caprio says:

            Yes, I’ve seen it before but I checked with Google Chrome and it was fine. You’ve tried a different browser?

  16. Thank YOU!!! I can’t believe I did it!! Hooray! Lina www.fancyfrugallife.blogspot.com

  17. hi sir am following same steps in my blogger .but it will not showing anything.and there is no error at saving template.Please help me and am using blogger theme simple magazine 2 theme pls reply to me sir

  18. Hi friend thanks to you for this awesome information, my blog now is using FB comment :)

  19. Chuck Porter ( says:

    I can’t find anything with with “post.body” or “div class=’post” on my blog…. not sure where to add the code in part iv.

    • Chuck Porter ( says:

      NVM – figured it out.

      • Don Caprio says:

        Alright, saw the widget on your blog already. :)

        • Chuck Porter ( says:

          This is a great little app – hopefully, it increases the amount of comments on our blog (most of our comments come from Anonymous because many of our readers don’t have Google accounts and don’t want to take the time to sign up). Thanks for instructions. One thing that I am having problems with is the enable notification part… when I follow that link and click on Settings it says loading and then never loads anything. Looks like it’s a Facebook issue… not sure if anyone else has had this problem. I’m going to try again a little later and hopefully it works.

          • Don Caprio says:

            It’s gotta be a Facebook issue or probably the browser. Hope you finally got it working.

          • Chuck Porter, Did you ever get the page to load when you click on settings. It’s three months after you’ve posted this and it does the same for me. Did you ever figure out a way around this, maybe another way to set up notifications and moderator.

  20. Chuck Porter ( says:

    Is there any way to get this to jive with the mobile version?

  21. Awesome plugin!!! Great work. thanks…

  22. Chuck Porter ( says:

    I changed my blog template to a third party template and when I did that I lost the Facebook Comment Box. Do you know of an easy fix for this or is this something that won’t jive?

  23. Thanks Don, it worked fine

  24. Hello, I did all the above and the commet box apperas normaly and when i comment it works(i’ve added myself as moderator) but when someone else commets he gets this message: “Something went wrong. We’re working on getting it fixed as soon as we can.” Also I don’t get a notification of a new comment. Ca n you help?

    • I posted a test comment just now and I didn’t see any error message http://www.asudotoi.gr/2012/11/periergaa_7199.html So far the right app ID is in the code, you should be notified. You didn’t get any notification from the comment I dropped?

      • Ok Don! Everything worked fine with your comment! I replied to you and the other thing i wrote(http://www.asudotoi.gr/2012/11/periergaa_7199.html?fb_comment_id=fbc_114411375387292_63644_114513528710410) also seems now to be working! Thank you so much for you great app!!

  25. I just the comment box for a few days snd took if off because, a comment posted on a particular post runs through all the posts, can u help. Thanks

  26. App creation failed Please use your personal account to create this app. To use a different name for testing, create the app with your personal account and then create a test account. If you received this message in error, please submit an appeal.

  27. How To make action default Post to Facebook Box aleardy have checked user no need to make check to post it to his profile I wish u understand me thanks for this good topic

    • Yes, Ahmed, I understand you. If a user is logged in to Facebook, the box is automatically checked. I checked your blog now and the box was already checked.

  28. thanks Don Caprio I love happy with your wondrfull posts…forward

    • atiqur rahman says:

      Hey, Bro. Don Caprio: This post is really helpful for me. I will try to add Facebook comment box on my blogger blog. Thanks for sharing this post with us.

  29. Thanks — Don Caprio Successfully added FB Comments to my blog.

  30. Clickbank Reviews says:

    Thanks for this Article Doncaprio, i have successfully added it to my blog @ Make Money Online

  31. Cyberneticus says:

    Thanks for sharing this cool widget with us. It’s definitely a real nice one to have. Keep up woth the good work.

  32. Thanks Don for the simple tutorial. The app works perfectly on my site and it also looks good thanks to your css code.

    • Glad you love it, bro.

      • Hi. When I try to add myself as moderator, I get this message: “Cannot add non-users or non-friends as moderators: Ara Aquino” What should I do?

        • Never mind this one, hehe ;)

        • Don Caprio says:

          Can you type in your email and press ENTER instead if that’s gonna works?

          • Oh thanks for the reply, but I was able to make myself as a moderator already. The problem now is that the comment box is not appearing on any of the posts. I double-checked everything, I did all correctly. How come it’s not working? :(

      • I did all of the steps, but the comment box is not showing :( What should I do?

        • Never mind this one as well, I got it to work :) I am using a design by Sora Templates (Eclipse) and appeared thrice in my codes so I looked for instead. However, when I paste the codes after it still doesn’t work, so I tried pasting it after . Unfortunately, it still didn’t work so I asked you what to do. After a couple of days, I tried pasting it after the second and it finally worked! It looked great, I have to say. But I had to revert to the simple Facebook comments because it seemed to me that there was already “a lot” happening in my pages. Anyway, great work, Don! Thanks for this one! Hugggs! xoxo

          • Don Caprio says:

            Yeah, I do understand… trying to keep post pages as simple as possible. Nice blog, Ara. :)

          • LOL I just noticed that the tags didn’t appear :P Anyway, I said: I am using a design by Sora Templates (Eclipse) and appeared thrice in my codes so I looked for instead. However, when I paste the codes after it still doesn’t work, so I tried pasting it after . Unfortunately, it still didn’t work so I asked you what to do. After a couple of days, I tried pasting it after the second and it finally worked! It looked great, I have to say. But I had to revert to the simple Facebook comments because it seemed to me that there was already “a lot” happening in my pages. Anyway, great work, Don! Thanks for this one! Hugggs! xoxo **remove spaces between tags ———- Yep, keeping it simple Don. Thanks :)

  33. SamDaddyCool says:

    Thanks bro. It works

  34. It’s work here http://how-tobecome.blogspot.com but here it didn’t http://moonl8.blogspot.com/ what problem Dear I applied all steps

    • Arakarenina says:

      I hope you don’t mind me replying here, but try to play with the codes :) Search for and if it appeared more than once, try to paste it after the first. If it doesn’t work, cut the codes and paste them after the second. And so on. Same thing with . If it doesn’t work, move the codes after , or , blah blah blah. Give it a try :)

  35. Don, I did what you wrote (and even added tweets) but my problem is, the “Posted by” tag is below the comments boxes instead of been just under the post. I need help! My blog is: http://www.campuzfilla.com

  36. Anodebe Anthony says:

    Wow, thanks @ don. its useful

  37. Behzad Ahmed says:

    Don, I did what you wrote, but my blog is showing old blogger comment box… help… :(

  38. Hi there, Thanks for this tutorial! I think it works. I tried commenting on my blog, and got no notification; is that just because it was me who wrote and not someone else? Also, the comment box is covering up my post-footer. How can I move it down? (haha, most of my blog design problems involve spacing – see my sidebar! – I really need to figure it out!) Thanks so much!

    • Ah, got it to work AND be in the right place! Yes! I modified it a touch, just to make it fit better on my page (removed shadow, changed “Love to hear what you think” to “I’d love to hear what you think”, removed the comment icon picture thingy, changed the font size of the title so it’s not so big…) The only thing is that I would LIKE it to fit the space of my blog post. Changing the size like you say in this post only makes the actual comment space where you write bigger and not the whole thing. Any recommendations?

      • Glad you got it working! By using width=’600′ it should actually be bigger… I mean the whole thing. Just noticed the apostrophe up there in the post looks a bit twisted.

    • Hi, I checked just now and it seems you’ve fixed it. It wasn’t covering the footer and you probably won’t get notified if you commented yourself.

  39. thanks..very helpful..i have implemented this on my blog.

  40. Can I keep both Facebook Comments and Disqus on Blogger at same time?

    • Yes, you can… But it may be confusing to visitors as to which on to use. That’s why I don’t use it anymore.

  41. Malik Ismail says:

    hi i have coded this step by step but it is only working for 1 post and not showing comment box for other post kindly help

  42. Nitesh saitand says:

    Nic………… post thnks

  43. I followed these steps but it seems the box is still not showing up. Do you have any suggestions?

  44. وظائف خالية says:

    me too I followed these steps but it seems the box is still not showing up. Do you have any suggestions?

  45. I tried your code but on my blog http://www.spicejaat.com its working on post pages but when on label search facebook messagebox is not displayed. Any resolution to it.

  46. Thomas Benezeth says:

    Hi, thanks ! i already did it but thanks for sharing. But, i want to have the notification on my mobile (iOs), in facebook’s app, i don’t know how to do that (i ONLY receive notification on facebook’s website, not mobile app). Any idea ?

  47. Shemul49rmc says:

    is it available for Thesis WordPress theme? Please let me know.

  48. Hi Don THANK YOU so much – it works!!! I just made some changes as I didn’t want the border. I have a question thought – I’d like the FB-comment-box to be AFTER the Linkwithin box. How do I do that?? Thanks in advance

    • Did you add the linkwithin box manually? You may have to locate the code within the template and place the Facebook code right under it. Alternatively, paste the Facebook code under <post-footer-line-1/>

    • I put it as a gadget using HTML/Java script and then placed the gadget below the posts. Do you mean I have to replace the code instead of below “”, after “” ??

      • Sorry, I meant replacing the FB code below Instead of below ? In the meantime I’ve tried doing this, but I cannot find the line

  49. Sara ElMasry says:

    Step 2 part iv searched for both codes and can’t find it now I don’t know where to put the code that will make the box show I thought the problem might be in the template I used one called Awesome Inc. so I changed it to water mark they both the same they don’t have that section and I just wanna know where to put the last code part

  50. Hi Don I searched for the right “footer-line” and placed the code in the place I wanted it. Thanks. It’s working and I already seeing comment, but I DO NOT get any notification, and I followed your instructions

    • Did you commebt yourself? You only get notified if someone comments on your posts.

      • I have now few comments in different posts, but I didn’t get any notice. I saw these comments by chance (and replied to them). You can see for example here – http://www.winnish.net/2012/12/blog-post_25.html They might be some that I haven’t seen yet….

  51. Babita tomar says:

    Dear admin, where will we get the notification if someone leaves comment on our post coz in default comment box we receive notification in blogger but when using facebook comment box where we will find this notification. Plz help.

  52. well done!!! It’s very cool ,thanks u so much :x Visit my site : www.share99.net

  53. hey bro i can’t add app domain it rejected with Error App Domains: www.photoscape-material.blogspot.com/ is not a valid domain. now what to do?? plzzz help

  54. what is the real advantages of having this comment box?

    • Big Brother Africa Fans says:

      keeping your site entertained. Facebook has most guys using it so it becomes easy for one to comment using Facebook comment box

  55. Wonderful and thanks for all. I have you use this for my blog www.facebooksrc.com

  56. Ferdinand Kamadin says:

    Thank you so much for sharing this don. I try it and it work !!!

  57. Ferdinand Kamadin says:

    after put it on www.bastanta.com now I put it on www.grafik4.com. Thankyou Don

  58. Ferdinand Kamadin says:

    Can I move the Facebook comment box at the lower side ? Below the standard blogspot comment box, because I prefer Blogspot comment box first, and Facebook comment box after it. Thankyou

  59. really nice and also very much helpful. thanks bro

  60. i already have the fb comments on my blog for some time and now its showing that “Warning: [url of the blog post] is unreachable.” i fear if i do the steps you’ve mentioned, my old posts with comments will disappear. do you know if anyone tried to change to your style and did not lost the old comments?

  61. Dear I have tried to follow the instructions, but the fb box did not appear. Would you mind helping check what is wrong if that is possible? Thanks a lot.

  62. This errors is coming ” Error parsing XML, line 3, column 339: Attribute “xmlns:fb” was already specified for element “html”.” while implementing this tool on my blog of ” latest jobs, bank job government jobs, exam paper and career resources” http://abhicareer.blogspot.com

  63. Alina Aronow says:

    I did all steps and it works. Thanks! One problem – people can only comment through Facebook if you’re logged in from a computer. It doesn’t work if You’re trying to comment through your phone. Please help! My blog is alinasfashtips.blogspot.com

  64. Already have fb comment on my blog, but without notification it difficult to trace any incoming new comment on each my post. Thanks don! nice tutorial, very much helpful

  65. I love this tutorial. It works so well on my blog. You deserve a million likes!

  66. Thank you very much! No instructions worked until I found your perfect explanation. It works just fine and it looks amazing. I just translated the top line to my language. Just one thing – when the page loads, it takes some time to load comment box. It sort of tries to load it many times before it’s finally done. Maybe there is a way to fix it? Thanks again lieknek-lengvai.blogspot.co.uk

    • That’s because it’s a server side javascript that has to be loaded straight from Facebook’s server. There’s no way tofix it, Ieva. Glad it worked for you though :)

      • Hello again, I hope you can help. Again:) I decided to change my blogspot domain to my own. And all the comments disappeared… Comment box is still there but all the likes and all the comments gone:( Is there a way to fix it please? Thank you Ieva

        • Don Caprio says:

          There’s no way to fix that that I know of. The comments appear as per the URL of each post and once the URL changes or even just your permalink structure, the comments disappear.

  67. Haha, that’s nice! Thank you a lot! :D

  68. Thank you! It’s not a big problem anyway

  69. Hi Don, thanks for the post. I believe Facebook has changed since you wrote this post. In step 1, iii, your instructions are to put in your domain or subdomain and in the lower section put in your site URL, there is no place to put my url. Help please!

    • I have figured out where to place my custom domain, but as of October 2011 you must input a canvas url and a secure canvas url, to which I have no idea what these are. Any help or reference you can give me will be much appreciated, thank you in advance:)

  70. Alina Aronow says:

    thank you very much!

  71. This Facebook comment box is not working.and you are not a trusted person now anymore cause you have wasted my time.

  72. Deepak Singh says:

    I have read your blog twice first part is under stable but second is not understable. and even i applied 3rd one and did it. Very informative, thanks for visual post

  73. Very happy … just opened this site for a while already be science anymore … Thanks

  74. Sumaiyya Naseem says:

    I tried this. Finished all the steps. But the comment box didn’t appear on my blog! :( And when I go to settings (for comment notifications) there’s literally nothing in the settings dialogue box, except ‘Save’ and ‘Cancel’ Help?

    • Alexis Mendoza says:

      I also experienced this, what I did is just go to my website, and check the comments area, theres a similar settings button there. That worked for me :)

  75. Thank you SO MUCH ! I love it!

  76. everything is in place but I’ve got one question – how can I put the comment box beneath every post on front page?

    • You only need to go to step 2 iv. Remove these <b:if cond='data:blog.pageType == &quot;item&quot;'> and </b:if>

      • i’ve tried ! it works !

      • I understand, thank you. I was thinking about something else: What if I would want to make a link at the right bottom of every post I make that says ‘Comment’ and that link is just the same ‘variable’ link that says the ‘name of the post’ and goes to the post page? And also automatically scrolls down to the bottom of the page to the comment form? I know how to make the page ‘jump’ to bottom but I have no idea where should I place the codes. What’s the code for the link up top and where should I place it? Have you got any idea how to achieve this?

        • ok I figured out where to put the ‘Comment’ jump link: COMMENT but I have no idea why the jump link doesn’t work, I’ve put the blabla after the line: and it’s linked to the comment link so it should jump to the bottom of the page but it does not happen. Have you got an idea?

  77. Hi Don, Thanks for the free info on how to do this, people like me really need all the help we can get with this stuff. I followed your instructions and was able to (eventually) get it to work! Any delay in making this work was due to my brain, not your instructions! The only place where I had to do something differently than was instructed was where you input the App domain. I couldn’t get any version of my blogspot.com url to be accepted, so I ended up leaving it blank and for some reason that worked !?! I hope it will still function alright. Many thanks for doing the HTML hard yards on this tutorial.

    • Hi Clair, Glad it worked for you. For the app domain, you could have simply used blogspot.com. I’m sure that should work. You can try editing the app.

      • I Am Magnus says:

        I guess there have been a few changes or just Errors. I used torch browser and IE It says, “Top-Level Domains are not allowed” when you use blogspot.com…. Still working on mine; i’ll leave App Domain empty. It seems i only need the App Id. but, then again, i’m unsure. Custom url and .blogspot got rejected

        • The comment box won’t work if the application doesn’t point to a valid domain. The domain has to be the domain the comment box is to be installed.

  78. MILLSMUSICENT says:

    BRO MINE HAS REFUSED TO SHOW ON MOBILE IT ONLY SHOWS ON PC PLZ AM URGENTLY WAITING FOR UR REPLY

  79. MILLSMUSICENT says:

    BRO MINE HAS REFUSED TO SHOW ON MOBILE U CAN ONLY FIND IT ON PC PLZ AM WAITING FOR UR REPLY URGENTLY

  80. Thank you, Don!! That was scary, but it worked! It looks awesome.

  81. This is a really cool app! Thanks for sharing! Is there any way to register as a developer without sharing your phone number?

  82. Nat Nanton says:

    Does these steps work with WordPress too? There are so many Facebook commenting plugins but none that actually notify you. Hope I can use your advice on my blog!

  83. I successfully added the comment box to my blog but when i try to add notification alerts by following the link “https://developers.facebook.com/tools/comments/?id=……….” and clicking setting, it just shows “loading” and remains that way… waht do i do pls

  84. Great info! Is there a way to receive notifications to mail instead of within facebook? Thanks!

  85. I have same issue as Mako has. Also comment box is not appearing under page URL (page which I have created under blogger). for post page, it’s working fine. Thanks for sharing this greate tutorials.

  86. berita terbaru says:

    yeah its perfect for my blog, thanks for great tutorial…

  87. Chuck Richter says:

    Hey Don, I tried following your directions and it’s not working for me. I’m using Blogger. Here’s my Blog: http://angelswinblog.blogspot.com/ …. I’m probably just lame, but I was wondering if I sent you mail if I could send you my template and if/when you have time, if you can add it for me. If you have a donation box or PayPal I’d be happy to send you some $$$ for your time. Respectfully, Chuck Richter AngelsWin.com

    • Hi Chuck, That shouldn’t be a problem. You can send me an email (caprio at capriofiles dot com) and we can work it out. Warm Regards.

  88. Beatriz Subtil says:

    hi there, i have a fashion blog and i was trying to put the comment box but unfortunetelly i couldnt do it although i followed all the steps, could you please help me? :/ ive been trying to use this for months :/ and the fb widget only works in the bottom of my messages and not post by post you see? Please give me a hand

    • Don Caprio says:

      I can only assume you’re putting the code under the wrong data:post.body. There’s likely to be multiple occurrences of this in your template and you need to locate the one that’s gonna work for you.

      • Beatriz Subtil says:

        hum but i did looked it up like you sid in case i was putting it on the wrong one. i can’t fix it thnks for the help

      • Beatriz Subtil says:

        i just saw it and its working!! thanks for all the help though thanks so much. oh btw ia there anyway to remove the headline that says ”Love to hear what you think!” thanks (sorry for being such a pain)

  89. hi, i followed the steps exactly but it doesnt work…cand u help me out? adress of the site: http://www.filmetitrate.net/

    • ps: there was no error message when i saved the template…but when o go to a post i scoll down no fb comment box appears…still waiting for ur help!!!

      • Don Caprio says:

        You put the code under the wrong data:post.body tag. You may try putting the comment box code under post-footer-line-1

  90. Funny memes says:

    Thank Dude, Works Fine, Thank For The Share…..

  91. I created a comment box and it works great the way I wanted for my customers responsive website . However when I look at in on an iPhone there is white space under the box.. Can you help me make it go away thanks in advance

  92. how do i change the color scheme to “dark” … the tutorial you made is for “light” color scheme

  93. Hi Don, Will the Facebook box displace my blogger box? Will it appear below or above it? Waiting for your reply please. Thanks a lot.

    • Don Caprio says:

      Hi Ugo, It will appear above your your default comment box, directly below your posts. It won’t displace your blogger comment box unless you disable that from your settings.

  94. That’s lovely.. Your tut is simplest. It worked like charm… Thanks for sharing.. keep doing the good work,, Regards, Noor http://www.trickshacker.com

  95. Oday Rawashdeh says:

    thanks for your fantastic post, i will try it and back to you if they are any problem

  96. hi dear Facebook comment box not showing on my blogspot site. kindly check it

  97. Sirius Black says:

    i implemented what you have said. but i ddnt use XFBML . still it worked ! Excellent Man ! :DDD

  98. This is great. i love it. well done bro…

  99. Thank you sir

  100. Mohammed Faizan Ansari says:

    I had installed facebook comment on my blogspot blog it is www.computertweaks.in . It worked fine. Whenever somebody comments using facebook comment I see notifications, and when I click on that notification it takes me to facebook developers moderation page, where I can see all the comments made on my blog. But the problem is: I am not able to distinguish on which particular POST that comment was made. I hope you got my problem. So how to resolve this thing? I mean how would I come to know on which post that comment was made??

  101. Hey Don, Thanks for this blog. I followed all your steps rigorously. But when I tried commenting using it it says you are not logged in. Please help me out here.

  102. Looks like I have goofed up somewhere and I am not able to track it down. Its funny though that, if i copy the link from the comment button and paste it on another window in the browser I am able to put comments. for example : https://www.facebook.com/plugins/comments.php?api_key=&locale=en_US&sdk=joey&channel_url=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D18%23cb%3Df2462420a8%26origin%3Dhttp%253A%252F%252Fwww.jaadathendi.com%252Ff2568ae80c%26domain%3Dwww.jaadathendi.com%26relation%3Dparent.parent&numposts=10&width=450&href=http%3A%2F%2Fwww.jaadathendi.com%2F2013%2F01%2Fblog-post_17.html#

  103. photo-to-canvas says:

    Hi! What works for me is to set a time to do blog hopping and blog commenting several times a week even each day. This gives me the opportunity to really know what is trending in my niche and reach out to other bloggers who talk about the same topic. I even share their posts in my social media accounts if I really find their content interesting and useful to my followers.

  104. MILLSMUSICENT says:

    thanks bro am using a blogspot mine worked perfectly but it dosent show on mobile what should i do?

  105. Ashish Christian says:

    Hey, Not Working Bro. Try So Many Times But no Success. Finally i Install disqus Widget.

  106. Works Perfect!!! You are a genius :D Thankyou

  107. way2readonline says:

    thanks for sharing this post, i am searching the how to embed Facebook Comment Box in Blogger. finely get good post, now i used your code on my blog.

  108. It worked! Thanks

  109. atiqur rahman says:

    Hey, Bro. Don Caprio: This post is really helpful for me. I will try to add Facebook comment box on my blogger blog. Thanks for sharing this post with us.

  110. Hi, thanks for sharing this tutorials. i’m wondering, why you are not using this kind of comment box.?

    • I was using it before but I decided to do away with Facebook comments. It wasn’t easy trying to moderate both Facebook comments and default WP comments at once cuz I get loads of comments here.

  111. O.M.G!!!!… It works like a magic. You can view my site to see how it looks so fit meritword.blogspot.com

  112. Pls. I want the facebook comment to be under the shearing icon. How can I do that??? pls view my site to see what I am talking about. Thank you in advance http://meritword.blogspot.com/2013/02/be-swift-to-hear-slow-to-speak.html

    • It’s quite possible but you have to locate the share buttons code within the template and paste the comment form code right under it.

  113. Waowww… :D Superb Man.!!! it was So easy to enable facebook comments on a Blog…Really Simple.Thank You Don…You actually made it easy..thank’s Check out My Blog & let me know comment box working fine or not. GOD BLESS.

  114. Hi there, Is it possible to control the thumbnail image that gets displayed on facebook walls when commenting?

  115. Heeee!!!!!!! I can’t believe I did this….

  116. Hi this is a bit off topic but is there any way to add a comment box to blogger similar to the one you have here. I looked at commentluv and see that it is only for wordpress. Do you know of anything similar that would work on Blogger. I’m not a fan of their drop down menu on the comment box

  117. oops…I just realize commentluv is an ap for sharing post . Anyway, to clarify, What I’m looking for is a comment box where, readers can just type in their name (like yours) instead of the drop down where they have to sign in through another account.

  118. Ndianabasi Udonkang says:

    Thank you very much for the step-by-step tutorial. Your post is the best on the web on this subject. Nigerians are definitely the best educators!!! Proud of ya. I also own a blog dedicated to the learning of CAD (and obviously it’s the only Nigerian blog on this subject). Please tell me what you think about the blog. Thank you. http://inventortutorials.blogspot.com

  119. This tricks doesn’t working for me…

  120. i get this ereo please try to help me when someone comment on posti get this this comment has not yet been published to facebook. publish comment

    • I’m getting the same message, and have to confirm twice before having the message publish to facebook page. “This comment has not yet been published to Facebook. Publish Comment”. Sara, were you able to handle it? Couldn’t anyone else help us on that? Don?

      • Don Caprio says:

        I never experiencd such issue. Did you change the settings to have comments approved before being published?

        • Thanks for your quick response. The posts are made public by default, and I seem to have made any important changes. I’ll start it over again so maybe I can fix something that could’ve gone wrong in the way.

  121. I want to add 2 comment box on my blogger blog one is Facebook and other is like comment luv what to do can you give me suggestion.

  122. Pls Don Caprio, I want It to show on mobile view…. How will I do that??? Pls Help

  123. Samuel Ibrahim says:

    Caprio, you are the Don men! Thanks a lot. I have been trying to add the Facebook to my blogger for quite sometime now, but finally with you outstanding expertise I am good. Thanks again. *taking off my hat for the Don*

  124. chairil kaka says:

    i like your artikel

  125. Thank you for this useful tutorial. It works on my blog -http://newschest.blogspot.com/. :)

  126. Googma Sansar says:

    Thank you for this great information. it is really helpful for me to modify my blog. i appreciate your contribution.

  127. tudor mateescu says:

    Hi, What plugin do you use for showing the php/html/java/code like you did on this page?

    • I’m not actually using any plugin for that. I only need to parse the code here, use HTML editor while composing and give it that background using a pre-defined style in the CSS.

  128. GarlicPickle says:

    Hey! It doesn’t work for me. I tried both the s and the . Help!

  129. GarlicPickle says:

    Sorry, I mean I tried both the “data:post.body”s and the “”

    • In some templates, you may have to try all the data:post.body’s to know which one works. So far the other codes are in place, it’s gotta work.

      • GarlicPickle says:

        Still no luck. Followed the steps and tried both the data:post bodys as well as post-footer-line1. Could it be because of this code I inserted for the facebook like button under div:post.body? (removed the angle brackets so it appears in the comment) b:if cond=’data:blog.pageType != "static_page"’ iframe allowTransparency=’true’ expr:src=’"http://www.facebook.com/plugins/like.php?href=" + data:post.canonicalUrl + "&send=false&layout=box_count&show_faces=false&width=55&action=like&font=arial&colorscheme=light&height=62"’ frameborder=’0′ scrolling=’no’ style=’border:none; overflow:hidden; width:55px; height:62px;’/ /b:if

        • Don Caprio says:

          No, it shouldn’t be the reason. Does that Facebook like button appear? Can you put the commment box code right under it too? If it doesn’t show up with that despite the like button still showin, then something is definitely wrong with the rest of the code or where you placed them.

  130. GiannnisGan says:

    Thanks a lot buddy! I needed to insert the code step by step for 3 times because it wasn’t working on me, but finally I tried to post the part under: instead of: and everything worked perfect! Thanks a lot!

  131. Thank you for great tutorial. It is really helful for me to install this pluging to my blog. I appreciate contribution.

  132. didn’t work for me followed all the steps… using ur ex-blogger theme… and the “xmlns:fb=’http://www.facebook.com/2008/fbml'” is already in the theme buh far from <html tried re-arranging it buh it didn't work.. any help??

  133. This is a real bummer but it didn’t work for me and actually messed up my coding =( Can you help me???

  134. Steve Giordano says:

    This works great. Thank you so much! One question: Is there a way to add it to static pages and the homepage? The comment will appear if I go to the post link, but it’s not under the homepage post.

  135. saurav gautam says:

    Thank you for this tutorial. I want to try fb-comment in google site also. But unlike blogspot google site does not allow me to edit complete html.. Is it possible to follow above steps in google site?

    • Don Caprio says:

      I really don’t know exactly how google site works but if you have no control over HTML editing, I’m not sure you can use it there, Besides, this tutorial is strictly for Blogger.

    • Google Boy says:

      For Google Sites integrating FB comment is very easy. Go to Edit HTML and before tag place the following code… remeber to replace ‘upalc’ with your FB ID.

  136. I’m wondering if there’s any way to integrate your FB comment box with the preset blogger comment box? On my site, focusonthebeer.com, I now have two comment boxes and I’m hoping just to have one. I wouldn’t mind just having yours but people can’t comment anonymously, or through google, or a variety of other options. Is there a way to have these options?

    • Don Caprio says:

      Unless you disable the default Blogger comment box from your dashboard. Facebook comment box also provide a few options for those not signed in to Facebook.

  137. random blogger says:

    hi! I love this tutorial and made it work. I have one question though, when I get a notification on my facebook it only brings me to the moderation page on facebook not the page where they commented. thanks!

  138. Google Boy says:

    I tried to integrate this on http://stories.jolchobi.com …but it is not working !!! Is it because I am using advanced mode or I have not been able to complete the last part of integration properly ?

    • Don Caprio says:

      I can see some share buttons below your posts so I guess there’s probably a problem implementing the last part of the code that’s supposed to be under data:post.body. Have you tried putting it before or after those share buttons?

  139. Thanks so much for this tutorial. It was all working fine till I had to find this For some reason it’s not in my html? What do I do? Thanks in advance!

  140. Zeeshan Ahmed says:

    This is Good Plugin and u explained in very detail :) thanks for your Post… Now days a new Plugin come across and thats too much awesome, With Facebook, Twitter, G+ and other Social Services. You can check by clicking below link :) http://www.thetrickslab.com/2013/03/how-to-add-smooth-comment-widget-to.html The Tricks Lab

  141. Hey, great post and it really helped me get the facebook comments working on my blog. I wanted to get some SEO out of it but the iframe issues made this impossible and, of course, the only way I could find to pull the text of the comments was through php scripts (which blogger doesn’t support). Soooo, i wrote a php script and threw it on my server and then called it as an object on my blogger template and viola! – it worked. In kind, I thought I’d share it with you and maybe add a little value to your already great post. Just paste this code in your blogger template above or below the commenting code and it should be good to go. If you want to view the results just remove the div tags and give the object some width/height parameters. Hope this helps some of you! One more note, the php script grabs the referring URL so it should work for any and all posts/pages dynamically – I thought that was a nice touch ;-) One final note, I AM NOT a programmer so this isn’t the prettiest thing in the world, but it works great…

    • just realized the code didn’t paste… here it is: <!– BEGIN Graph API comment pull and text insertion in an invisible div for SEO purposes –> <div class='separator' style='clear: both; display: none; text-align: center;'><object data='http://sukithookahs.com/get_comment_text.php' height='60px' type='text/html' width='450px'> </object></div> <!– END Graph API comment pull and text insertion in an invisible div for SEO purposes –>

      • sorry, now I noticed a type :-( &lt;!– BEGIN Graph API comment pull and text insertion in an invisible div for SEO purposes –&gt; <div class=’separator’ style=’clear: both; display: none; text-align: center;’>&lt;object data=’http://sukithookahs.com/get_comment_text.php’ height=’60px’ type=’text/html’ width=’450 px’&gt; &lt;/object&gt;&lt;/div> &lt;!– END Graph API comment pull and text insertion in an invisible div for SEO purposes –&gt;

    • Don Caprio says:

      Great idea, JP. Never thought of that. Thanks for the addition!

  142. hi don. i followed your instructions and examples but not seeing comment box. not sure what i did wrong. can you assist? thanks, dk.

    • Don Caprio says:

      You can try putting it under another data:post.body if the one you used isn’t working.

      • hmmmm, i found two and tried it under each and still no show. i found one and tried there too. still nothing. any other thoughts? thanks for your help!

        • working! thanks. do you know if it’s possible to have these comments also show up on the blog’s facebook page instead of my personal page?

          • hi don. it was working. can you take a look at my site and give me your thoughts on what’s going on? thanks.

          • Don Caprio says:

            I checked now and saw it’s already there. you got it working already.

  143. TheBestSEO says:

    Hi Don ! Thank you for haring an excellent ideas to installed Facebook Comment Box and notification Plugin. It will try to my blog.

  144. Thanks alot… this is working Fine… i won’t remove Credit link :) god bless you

  145. Hello.. Really Nice box and all working fine. Can you help me 1 thing please… to make appear at home page fb comment box ( under pic same with social share). Thanks for your time and great job. http://wesharefunny.blogspot.com/

  146. Alberto Rodriguez says:

    Thank you for this great tool! I have it working on the simpler of my blogs (static) as a trial. My only concern is having both the Facebook and the standard Blooger comment box showing up. Is this supposed to happen? Also, my standard FB [LIKE} widget has stopped displaying. What would cause this?

    • Don Caprio says:

      Hi Alberto, Having both comment boxes appearing isn’t a problem but if you’re not comfortable with it, you can disable the default blogger comment box from your Blogger dashboard. For the FB like, are you using the iFrame version? or XFBML?

      • Alberto Rodriguez says:

        I will leave both boxes. About the blank widget, I found the App Id missing in one location. Fixed it and facepile is now working fine. Thanks!

  147. Hey, Thanks man! it is working perfectly fine for my blog :D

  148. Hi, Don. Thanks for this tutorial. However, I’ve tried all the steps but still it didn’t work out on my blog. Is there something that I’ve missed or wronged to follow here? I hope you could help me out. Thank you.

  149. Hi, I’m pretty new to blogging and tried this on my blog but it just didn’t work. There are no error messages but the Facebook comment option just doesn’t come on the blog. I had a bit of trouble with the 4th part of the code. I have 3 of this – data:post.body code and 2 of the footer code. I tried copying your code below the second footer code and also below the third data:post,body code. But nothing seems to work. Pls help me out. Thanks Dee

  150. nice post and large traffice generator THANKS

  151. REALLY you are a advanced blogger thanks for this plugin

  152. i followed all instructions, but comment box isnt showing on my mobile… what should ido next to have it apply when viewing blog on mobile

  153. Nice tutorial, but facebook comment box is not showing when view with mobile

  154. I tried this earlier today, and the code worked fine – then I guess I had too many different blogger code windows open, so I must have shut down the wrong one….code was gone except for the css styling box for FB comments. I can not get this to work on my blog again, but I did notice that blogger reverts characters to ascii (or whatever it means when the ‘ mark becomes ' ) and absolutely will not save the code as it is copied and then pasted. I realize this is likely a blogger issue rather than an issue with the code, but I even pasted it with the “characters” all typed out and it still won’t show on my blog. Any suggestions? Also, when I do get this working again: is there a way to get the FB comment box right under the blogger comment box, and not directly underneath the post itself? Thank you for sharing your code, and for any help you can give me!

    • Don Caprio says:

      I can only suggest you clear all edits and try again. Better still, if you saved your template before making those changes, you can restore the backup and try the steps all over again. It’s quite possible to place it under the default Blogger comment box but I’ve never tried it before. The last part of the code that’s supposed to go under data:post.body can be placed before <div expr:id='data:widget.instanceId + &quot;_comments-block-wrapper&quot;'>

      • Thank you so much for your quick response! I will definitely try this again, because I’d love to have it on my blog :)

      • Cleared everything out; thanks again so much for trying to help! Unfortunately, blogger will absolutely not save any code as I have copy/pasted it, and the needed things like the apostrophes or single quotations turn into four characters – AGAIN. Ugh.

  155. Thanks so much for your help getting the facebook commenting onto my blog! I’m just wondering what to do about the default blogger comment box that is still left underneath the facebook? Seems a little odd to have both still ;P Any help you can provide is GREATLY appreciated!

  156. hey thanks so much for the tutorial! its great… on step 3, I cant figure out how to turn on comments? When I click on settings in facebook it just says loading forever? any tips? thanks! taylor

  157. Leticia Rezende says:

    Great, thanks, it worked perfectly.

  158. Hello Don, I used your instructions about 3 months ago and comment box worked perfectly all this time. THANK YOU! Now last couple of posts keep getting strange message “unreachable” inside the comment box. I would appreciate your advice if it’s possible to fix it. And one more quick question. How can I change the language on my “like” button? Thank you Ieva

    • Sorry, I forgot the link to my blog, so you can see what I mean http://lieknek-lengvai.blogspot.co.uk/

    • Don Caprio says:

      Try to debug the URL of the new posts here to let Facebook access them quicker: https://developers.facebook.com/tools/debug Changing the like button language depends on the version of the button you’re using. Check this page: https://developers.facebook.com/docs/reference/plugins/like/ It explains hot to change the language. You can get the right language code here: http://facebook.com/translations/FacebookLocales.xml

  159. Julia Al Arab says:

    I don’t get any notifications for the comments I did all the steps as mentioned!!

    • Julia Al Arab says:

      Sorry I missed something, the settings in the comments tool don’t open, I tried using another browser but I only got a banner titled “Edit Comment Settings” with save and cancel buttons and no settings inside!!

      • Don Caprio says:

        That’s rather strange. It’s supposed to appear.

        • Julia Al Arab says:

          Well I tried again today and I chose the moderator and still didn’t get notifications :(

          • Julia Al Arab says:

            Also in the link “https://developers.facebook.com/tools/comments” there are no comments! Comments only show on the blog not this page nor in notifications.

  160. Hi, I followed these directions but don’t see the comment box on my blog. can you tell what i’m doing wrong? when i go to the moderater site for the comments i can see posts people made through facebook but not sure why I can’t see it on my blog: www.danalaymonphotographyblog.com. thanks!

  161. bro, it didn’t appear on my site but there’s an empty space under my post…. PLEASE SHARE YOUR WISDOM, I’M NEW AT THIS BLOGGING STUFF

    • Don Caprio says:

      I saw the white space but on checking your source code, all I see is a lot of line break tags. This sure works unless you’re doing something wrong. Maybe you can restore your backed up template and try again.

  162. thanks bro, it realy work for me. since i hv been finding it difficult to install it in my site, untill i found it here, u realy solve my problem,

  163. Erakata.com says:

    Hi doncaprio, thanks for your article. Btw, How do if I want to restrict comments that appear? thx

  164. it is really great tips ….i follow ur tips …

  165. Ralph Marcuss says:

    Thank you for this tutorial! This will help me a lot to gain more comments in my blog post! Others prefer facebook comment because it is easier to use.

  166. Carol King says:

    Hi there, just a quick question before I try to do this, will this tutorial work if I am using a dynamic template? And could you maybe just peek at my site to see if you think it will work with my current template. Thank you in advance.

    • Don Caprio says:

      I don’t know if it’ll work on a dynamic template but I’m very sure it’ll work on that mobile responsive template you have.

  167. nice post very useful for me thanks

  168. why the facebook comment box only show in my old blog post didn’t show in my new post (post after add the comment box) Please help me ! thanks you! www.joliediary.com

  169. Carol King says:

    Hi Don, thanks so much for looking at my site. I do have one more question, when I click your link to go to the Facebook Developer page, it is totally different from the page you show in your tutorial and there is no option to “create an app”. Has the link to the page changed and if so can you post the new link, thanks again.

    • Don Caprio says:

      It’s gonna be different if you’ve never created an application before but you will eventually come to that page. The link is still the same but I guess you need to first sign up to become a developer.

  170. Interior Designer says:

    this article having uniqueness and helpful for me……….

  171. Hey, I added the comment box and it was working well but I am not getting notifications on Facebook when someone comments. Any ideas?

  172. صورة فيس بوك says:

    its not showing on my blog help meeeeeeeeeeeeeeeeeee whay ?

  173. Is there any way to have the facebook comments box appear if they are on the blog homepage and not on a post? You can only see the facebook comments option if you have clicked on a post link. thanks!

  174. Junaid Tahir says:

    Hi Don, Your tutorial is really very clear and elaborative; indeed a well written article. I implemented it on my blog but it is not working. Just to mention my original blogspost address is paradigmwisdom.blogspot.com and I have a domain www.DailyTenMinutes.com. This domain is actually a mirror of my blogspot. While making my facebook app, I mentioned www.DailyTenMinutes.com do you suggest making a new facebook app with paradigmwisdom.blogspot.com? Thanks bro Junaid UAE

    • Don Caprio says:

      Hi Junaid, Since the main site is www.dailytenminutes.com, the domain should be dailytenminutes.com while the URL should be http://www.dailytenminutes.com for the Facebook app. If you did all the steps and the comment box isn’t yet showing up, you can check step 4 and try other data:post.body tags in the template.

  175. For some reason the comments have moved to the right when it was centered whY?

  176. Hello, thank you for sharing this. I implemented in February and it was all working fine. However, today I noticed that the comments have shifted to the right and no longer fits in the FB comment “box.” Any ideas on how I can fix this? Thank you so much.

    • Don Caprio says:

      Hi Maria, I just updated the post with the code to fix the issue. Please do check and let me know if it’s working.

      • Thank you. For some reason I couldn’t find the old codes to replace, but it looks like the problem fixed itself now. Everything looks back to normal without me changing anything. Thank you again.

  177. Hello Don, I have added your app on my site a long time ago and I didn’t have any problems. Although today I saw that the comment box moved right for no reason. Check it out if you please! http://www.asudotoi.gr/2013/04/blog-post_7834.html It is the same on every post! How can I fix that? Why is tha happening?

    • I have the exact same problem… Its been working great until i noticed this today. The main outter box is still ok but the actual comment box inside it has shifted to the right and I can’t seem to find a problem in the code that could have caused this.. any help would be muchly appreciated. http://www.mybooksnthings.com

      • Don Caprio says:

        Hi, Thanks for letting me know about this. I just updated the post with the fix for this issue. Please let me know if it’s working for you. Thanks!

        • Hey Don.. This has very nearly fixed the problem for me. The only thing now is that it isn’t quite centering it, it’s slightly to the left now and in the code the p align tag doesn’t seem to want to close. (it’s red) have been staring at it for about 40 mins now and can’t seem to see why. Don’t know if it’s just me. But ive fiddled with the width and got it to fit neatly. Thanks for fixing so quickly :0)

        • Problem solved! Thank you! :-)

  178. howtoread says:

    here is the solution to Error parsing XML, line 4, column 290: Attribute “xmlns:fb” was already specified for element “html problem visit this below link http://www.howtoread.co.in/2013/04/facebook-recommendation-bar-parsing-error-solution.html

  179. Notification is not working Why Please Help Me..

  180. Arti Honrao says:

    Hey! Despite following the instructions properly, there is no notification for the comments posted. The first time I had installed, there was no notification but suddenly one day I started getting notifications and now they have stopped again. I removed it and did it again, but no notifications :(

    • Don Caprio says:

      This looks like a problem with Facebook. I’m yet to find a fix for it but will post an update when there’s one.

  181. Hi.. I’m not getting any notifications when someone comments anymore. Googled the problem, seems to be a very common issue but cant find a reason. It used to work fine. Any ideas?

    • Don Caprio says:

      Perhaps it’s a problem with Facebook or something. It used to work but a lot of people now complain the notification isn’t coming anymore. I’m yet to find a fix for this.

      • Yes. I was thinking the same thing as I haven’t come across any fix either. I’ll keep checking back here just in case. Hopefully, if it is a facebook issue then they’ll sort it out asap.

  182. sipahi reza says:

    fb don’t notify me :( please help. i do fallow all step properly.

  183. SRIKANTH says:

    thank you Don Caprio the Facebook comment box is working in my blog. This article will help more blogger to get more visitors.

  184. Thank your for the post with so clear instruction. I will try it on my game news blog.

  185. movie kangz says:

    hey Don, Im wanting to install this last bit of coding but just one question. Why are your urls in the final coding??

    • Don Caprio says:

      That is only to promote the widget and help more people find it. Of course, you can remove it if you like but there’s no harm keeping the credit anyway.

  186. Simon Child says:

    thank you so much :D it works perfectly :)

  187. rahmat tahir says:

    It’s a success… Thanks for the guide. However, fail in attempts to change the width.

  188. jaratsee says:

    Hello again Don, I changed my template and not working Facebook comment box anymore, i do all the steps again at new. Please help me again Don. THANKS

  189. seo specialist in sharjah says:

    Great guidance with superb images, i m impress with your given facebook app application development guidelines.

  190. jaratsee says:

    any update please

  191. Abubaker says:

    Dear Its not work in my Side :(

  192. IndoPhotoshop says:

    how if i forget my app id ?

  193. thank you it works for me :) -

  194. this works only for one of my websites, for the other one it seems not be working, they are both on blogger….I don’t understand why

  195. Sarah Binney says:

    Hi, I did this and it worked but when I tried to implement update 1 to get the comment box on the homepage it didn’t work anymore. So I repasted the original code to get the box on the blog posts but it won’t work anymore even though I’m following the exact same steps. Any ideas? Sarah

    • Don Caprio says:

      Hi, If you backed up your template before implementing the codes, I suggest you restore the backup and then try the steps all over again. Something must have went wrong while replacing the code.

    • Sarah Binney says:

      I figured it out. One of the lines of code I was supposed to find occurred twice. I was putting it in the wrong spot. Thank you so much for such a detailed tutorial!! Sarah

  196. funnbooks says:

    sir, i put those codes as u directed,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,but its not showing comments…please help

  197. Thanks so much for this! It was an easy to follow tutorial :)

  198. Hi, I used this code for my two blogs and it worked perfectly – until some time ago (I’m guessing a month or so). I get no notifications regarding new comments. Moreover, on the developer tab on my FB page I got some notifications about these apps not being compliant with some changes that will take place in July 2013. I have absolutely no idea what to do to fix the apps. It would be really lovely if you could take a look at it. Thanks!

  199. notsosupermomconfessions says:

    Great post but not working for me either! Followed your instructions to the letter and no go. And somehow I have ended up with an AdSense ad embedded in my posts? WEIRD! BTW, I COULD get the comment box to show up as a banner gadget at the bottom of my home page or on the sidebars, but never under the posts. What gives? Any help.info is appreciated!

    • notsosupermomconfessions says:

      Also, I did restore previous template and STILL AdSense ad embedded. UGH!!

    • Don Caprio says:

      I’m sure you’ve tried other things on your template that resulted in those Adsense ads, not the code in the post. I would never stoop so low as to embedded an Adsense code in my widget. Anyway, I checked your blog to see what’s stopping the comment from showing but I can see you have a different widget already.

  200. Phạm Hữu Dư says:

    Hello Don Caprio, your code is too much, how can shorten it?

  201. Widget For Blogger says:

    comments widget should be awesome like yours because it helps in building relationship with readers and engaging conversation ,many of the top bloggers like you have written about it and also give importance to it.thanks for sharing.

  202. Starting a Business says:

    This article is having uniqueness and is helpful . I have posted some tutorials on my blog and i hope, my tutorials will clear your remaining issues related to “Facebook Comment Box” .

  203. It’s works and alive … thanks bro!

  204. Hello there I have the comment box on my other website which works fine. But I have tried to add it to the new website I have made and it does not come up for some reason, do you know why mate??

  205. Comment box is working fine…bt Im nt getting any notifications… :( Nice work..

  206. I did all the step but then it didnt work, now my my commen box missing

  207. hikan sakura says:

    great tutorial, and its work, thanks :)

  208. Pratyush das says:

    Can we make the comment box dark-themed? Many people will like that as white comment box does not go will all blog templates. Thanks for this .

    • Don Caprio says:

      On Step 2. iv, right after width=’450′, leave a space and add this: colorscheme=’dark’ That should do it.

  209. R. Conrad Bane says:

    Thank you for such a thorough tutorial. However, I have an error that I cannot get around: “Error parsing XML, line 3, column 2: The markup in the document following the root element must be well-formed.” How do I fix this? Thanks.

    • Don Caprio says:

      I believe this has to do with some syntax error while pasting the code on Step 2.i. Can you please re-check?

  210. Thanks for this tut. Ive done everything that you said but for some reason im not getting any notifications. Ive had few ppl comment on certain posts but I still havent been notified. The comments show up on the developers page when I check but as u already know it doesnt tell u on which post the comment was left. Any help to solve this would be greatly appreciated. Thanx again

    • sorry here’s my site url… http://www.dancehallanthemz.net

    • Don Caprio says:

      Hi Maestro, Like I replied earlier, this seems to be an issue with facebook as the notification thing was working fine till a few months back. I’m yet to find a fix but I’ll update this post when there’s one. Thanks.

  211. Still looking for a solution to this problem i have with the comment box. I still havet received any notifications although ppl have comment. Can u please help me out bro! Thanx in advance

  212. Erin Herlina says:

    hi i have coded this step by step but it is only working for 1 post and not showing comment box for other post kindly help

    • Don Caprio says:

      There’s likely to be a mistake somewhere because it shouldn’t be. I suggest you restore your template from backup and start all over.

  213. Kontes Humor says:

    Thank you SO MUCH ! I love it!

  214. its not working with my blog… :( m using separate html codes for each post now

  215. Fedrick Theophilus says:

    wow it amazing but cant work in my blog www.9aijahouse.blogspot.com

  216. Actually am looking for this code from several days and through search landed on this great post. I applied it on my blog and its working. Any SEO benefits of this script??

  217. kayultimate says:

    nice post but am having a difficult time integrating it to my blog

  218. zakariae says:

    hi I am Moroccan I am weak in English I made ​​all the steps but I see not comment on my blog facebook there’s nothing there help me stp blog www.footforyou.blogspot.com

    • Don Caprio says:

      Hi Zakarie, Like I pointed out in the article, if you have more than one data:post.body tag in your template and the first one you pasted the code under isn’t working, try the next one or use post-footer-line-1

  219. sumber eferensi online says:

    Thanks for this tut. Ive done everything that you said but for some reason im not getting any notifications. Ive had few ppl comment on certain posts but I still havent been notified. The comments show up on the developers page when I check but as u already know it doesnt tell u on which post the comment was left. Any help to solve this would be greatly appreciated. Thanx again

  220. Don nick says:

    Thanx it worked for me…. check it out @http:// www.mbakamusic.blogspot.com

  221. Hey Don, I found some more text rendering php scripts for the Facebook comment tool. It took a little tweaking but I finally got it working on our blog. Now it organizes each comment in a more ‘reader friendly’ format and displays the commenter’s current facebook photo. Again, I have this in a hidden div behind the actual comment box so only the search engines see it and index it for SEO. I saved this script in a new location and I’ll leave the old one up for those who are already calling it. The link to more info is: http://americanhookah.com/blog/get-seo-friendly-facebook-comment-text/ and the script is below: [code] [/code] Hope you find this useful.

    • Don Caprio says:

      Hi JP, Unfortunately, the code isn’t showing. Again, isn’t it considered a shady SEO practice hiding things from regular users but showing it to search engines?

      • Don, my understanding is that, as long as the content matches exactly, it won’t be an issue. I think the invisible div may flag the page for review when the webcrawlers hit it but, once it is examined, the search engines (Google specifically) recognize that the content is identical and that its purpose is to make the legitimate content index-able for their bots. I’m not sure why you’re having issues getting the content to pull. Here’s a link to a fully visible version of the script output and a fixed URL (the normal script uses a dynamic reference for the referring site): http://americanhookah.com/americanhookah/get_comment_text_display.php The original blog post that this is attached to is: http://blog.sukithookahs.com/2013/03/get-seo-from-facebook-comments.html . If you want, take a look at the output, then drop in a comment on the blog post, and reload the output page to see it in action. Maybe we could try an work on this one again – I thought we fixed it last time we spoke?

        • Don Caprio says:

          I used it and it works great but I still feel uneasy cuz it’s hidden. I found a WordPress plugin that does this though: http://wordpress.org/plugins/seo-facebook-comments/

  222. Sathya Selvaraj says:

    hi don, Facebook comment box is not appearing in my blog under post. could you check it out. http://sathyaselvaraj.blogspot.in/

  223. I used the codes you posted on the older post about how to add comments to your blog…I would like for fb to notify me when people leave comments. I followed your instructions above, but when I go to settings and choose myself as moderator the settings box just appears blank and only shows save changes or cancel. Do you know how I can get this to work?

  224. Ignore my previous comment please. It seems that I have figured it out now. I wasn’t able to select myself as moderator from the link you gave above, but when I went to my blog and to the fb comments box if I clicked the settings there then it let me choose myself as the moderator. Thank you for all that you do!

  225. Hi. I got this message while trying to save the template after placing the codes as you instructed: Error parsing XML, line 3, column 2: Content is not allowed in prolog. How do I fix it please?

  226. I added this custom comment box to my new site www.malayaliscorner.com, but how can I hide default comment box? When I try to hide comment box from blogger settings, it also hides the fb comment box.

  227. معلوماتي says:

    thank you about this post

  228. Miralem Asceric (Besplatne Knjige) says:

    Hello! Thank you this tutorial, everything works except comment notifications – I don`t get any notification on new comment on my blog. How to fix it? Thank you

  229. Completed all steps as per your post but my facebook comments are not appearing :( Not sure what is wrong… do i need to worry about the “App Details” status on the developers.facebook page … where it says “Approval Status: Unsubmitted” ?

  230. Ricky Pesiwarissa says:

    thankyou so much, can i share this it on my blog?

  231. Hello! I was wondering if you could help me out. I have used your instructions for adding the fb comments on my blog in the past and have been very successful. Now that I updated my blog and installed a new template I can’t seem to have the same success. My comments from blogger aren’t even showing up. Is there any guidance you could share with me please?

  232. Obat Penyakit Asam Urat says:

    hum but i did looked it up like you sid in case i was putting it on the wrong one. i can’t fix it thnks for the help

  233. now using for my blog. thanks you for this great plugin. i like this blog that help new bloggers ..you are real human who have a real helping nature.. thank you

  234. Ogunsola musibau says:

    Don. I have been using it before. But letter, i cant found it again.maybe i will go for it now.thanks for the great post

  235. Facebook Login says:

    Don, i just opened a new wordpress blog and would love to integrate the facebook comment box. Is it possible to use the above codes on a SWIFT (free version) Theme. And you mentioned plugins for wordpress above, which is the best of the facebook comment plugins. I’m seeing a whole bunch here on the plugin installer.

    • No, this won’t work for WordPress. I think there’s an official Facebook plugin that does what you want. Mayb you should try it out. http://wordpress.org/plugins/facebook/

  236. bro nice work but i have a little problem fixing the code next line after but it only show on mobile view lol any have???

  237. Real need it, but i’m not sure trying it.

  238. Hi Don I was using your comment box for a while and everything was ok, but today it disapearred. The only thing left is the top part “thanks for comment”. I didn’t do anything with blog code since I installed it last time about 6 months ago. How could I fix this please? Many thanks Ieva

  239. Hi bro, thanks for thist post I try to installed

  240. Odey Godwin says:

    This is the meror message am getting:> template-skin only available for templates version 2 and above

  241. Thanks a lot. I love this facebook comment form coz it comes with notification enabled.

  242. With this comment form, I have embedded it on my site http://jayr-concepts.blogspot.com/

  243. Vivan Cosme says:

    Hello every one there my name is Vivian Cosme from Canada I never believed in love spells or magic until i met this spell caster once when i went to see my friend in Africa this year on a business summit. I meant a man who’s name is DR ONIHA he is really powerful and could help cast spells to bring back one’s gone, lost, misbehaving lover and magic money spell or spell for a good job or luck spell .I’m now happy & a living testimony cos the man i had wanted to marry left me 3 weeks before our wedding and my life was upside down cos our relationship has been on for 3 years. I really loved him, but his mother was against us and he had no good paying job. So when i met this spell caster, i told him what happened and explained the situation of things to him. At first i was undecided, skeptical and doubtful, but i just gave it a try. And in 9 days when i returned to Canada, my boyfriend (now husband) called me by himself and came to me apologizing that everything had been settled with his mom and family and he got a new job interview so we should get married. I didn’t believe it cos the spell caster only asked for my name and my boyfriends name and all i wanted him to do. Well we are happily married now and we are expecting our little kid, and my husband also got the new job and our lives became much better. His email is :onihaspiritualtemple@yahoo.com

  244. I can’t find both tags Please!!! help

  245. Hi, Thank you very much for the tutorial. I used it successful on my blog in the past, but now I’m trying to do the same for my friend and it doesn’t seems to appear on the blog. What should I do? Her blog is http://bisofcake.blogspot.co.il/ Thanks Navit

Share Your Comments & Feedback:

Please do NOT use keywords in the name field because they won't be linked to anything anyway...just use your real name. Let's try to have a personal and meaningful conversation.

Commenting Note(s):
To insert code into comments, use: [php]code in here...[/php]
Some HTML tags allowed: <strong>, <em>, <del>, etc. (Just don't overdo it, please!)

Current ye@r *