29 March 2012

Remove the ‘0 comments’ label on Blogger

With the recent revamp of the commenting system and a rumored Google+-based solution for sites, there are still some minor tweaks that can make Blogger comments work better on your blog or site. One thing that nagged me was the fact that below each article there is a rather big section dedicated to the number of comments – which is well and nice if there are comments, but completely useless on posts with none (I have a fair amount of those, as most casual bloggers do). So if you want to remove that part of the page, follow the instructions in this article. This involves changes to the HTML template, so be sure to back it up first, just in case.

In the new dashboard go to ‘Template’ ► ‘Edit HTML’, click ‘Proceed’ and check ‘Expand Widget Templates’. Here search for the following block of code:

<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>

This piece of code is responsible for generating the section underneath the blog post displaying the number of comments, including when there are none. It should show up twice in the template. You need to wrap this entire code section inside a conditional tag, so that it will only be visible if there is at least one comment. The final code in the template should look like this, with the code you need to add in bold:

<b:if cond='data:post.numComments != 0'>
<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>
</b:if>

While we’re on this subject, you might want to have another text displayed on your main blog page if there are no comments, instead of the standard ‘0 comments’, something like ‘No comments’ or even ‘Post a comment’. This can also be easily achieved with another change to the template. Search for this code block:

<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> <b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/> <b:else/> <data:post.numComments/> <data:top.commentLabelPlural/> </b:if> </a>

Replace every occurrence (there should be two or three) with the code below. As before, the bold section is new code to be inserted, while the italic text can be chosen freely. This will become the anchor text for the hyperlinks to the comment form on articles with no comments.

<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> <b:if cond='data:post.numComments == 0'>No comments<b:else/> <b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/> <b:else/> <data:post.numComments/> <data:top.commentLabelPlural/></b:if></b:if></a>

Another small inconsistency I noticed on Blogger is that when there is only one comment to an article, the label still uses the plural ‘comments’. It’s a bit odd, because the template actually has two different variables for the singular (<data:commentLabel/>) and plural forms (<data:commentLabelPlural/>), but in the user interface we can only set one of the two. If you want to correct this, you can simply replace every occurrence of <data:commentLabel/> with normal text: ‘comment’. Using an example above, you would use this code:

<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> <b:if cond='data:post.numComments == 0'>No comments<b:else/> <b:if cond='data:post.numComments == 1'>1 comment<b:else/> <data:post.numComments/> <data:top.commentLabelPlural/></b:if></b:if></a>

44 comments:

  1. Hi, and thanks for this attempt to help with an annoying problem! Unfortunately, I do not have the same code block you say I will have in myhtml (I use the Simple template in Blogger.) It is close, but not the same. Safe to try anyway? I replied in more detail on the Blogger Help discussion thread:

    https://productforums.google.com/d/msg/blogger/avdb24mdFEc/z_v19ylFUE0J

    If you have a chance to look and reply in that venue I'd be very grateful!
    Nancy

    ReplyDelete
    Replies
    1. Hi Nancy,

      I assume the Blogger template code works more or less the same with the Simple template. Looking ot the code you posted on the forum, I think you should make this change to replace the link labeled No comments with Post a comment on you blog homepage:

      < a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' > < b:if cond='data:post.numComments == 0' >Post a comment< b:else />< data:post.commentLabelFull />< /b:if >< /a>

      Hope this works,
      George

      Delete
  2. I'd like to replace all instances with "View comments" regardless of if there are or are not comments. So on the homepage, I would have "View comments" under each post.

    Reason for this: I have installed CommentLuv but it is not integrating with the Blogger's comment counter

    ReplyDelete
    Replies
    1. I don't have any experience with CommentLuv, but from looking at your blog it seems CommentLuv is removing the standard Blogger comment system all-together, that's why the default links don't work anymore. You should look in the Blogger template for a line like < div class='post-footer-line post-footer-line-1' > and add a link to the CommentLuv section of the post there.
      This should work and get people to the Comments section: < a expr:href='data:post.url + "#idc-commentcount_label"'>View comments< /a>

      Delete
  3. Thanks for sharing this! I was wondering if you can help me with another problem - how to change the text 'Subscribe by email' that comes below the comment form?

    ReplyDelete
    Replies
    1. Hi! Sorry for the late reply, I was on holiday.
      The comments section on Blogger is generated by an external script (hosted on Google's servers) so it can't be changed through the template designer. You would need to add a piece of custom JavaScript, I think, but that's beyond my area of expertise.

      Delete
  4. Hello. Please advise me how to hide the link "comments" from the home page? On the home page I have new posts. For each of them the "comments" link. Thank you :)

    ReplyDelete
    Replies
    1. You can wrap the comments code (the first one in my article) in an extra condition to check if the post is on the homepage or not:

      < b:if cond='data:blog.url != data:blog.homepageUrl' >
      [comments code]
      < /b:if >

      Delete
    2. Aha..! Found a solution at last: How to hide comments label from Blogger homepage and make it appear only on post page. I studied the Blogger template and found this. Also successfully applied it to my blog. Thank God for that.! George, I hope you'll link this post in your blog.

      Delete
  5. Hi George,

    I accidentally deleted the code that says "show no comment," and now my whole comment section is gone, and no matter what I do I can't get it back. Can you help me?

    www.thehautelife.ca

    ReplyDelete
    Replies
    1. Hi Janice,

      If you haven't backed up the template you can try resetting the widget templates, that should undo the changes. Go to Template > Edit HTML and click Revert widget templates to default.
      Keep in mind that this will also reset other manual tweaks to widgets and posts.
      It's best to regularly back up the template in case problems like this occur.

      Delete
  6. Hi George,
    How can I hide comments from appearing on Homepage alone? ie I want to show comments box below post while people are going through them and to hide it from homepage. When I try to hide comments they are hiding from everywhere..! Hope you could help me. This is my blog: http://josephstutorialshop.blogspot.com Here you can see "No comments" below every posts.. I need to hide it and make it appear only when people clicks on the posts..!

    ReplyDelete
    Replies
    1. Hi,
      you'll find the solution in a previous comment; you need to add an extra check around the default code for comments.

      Delete
    2. Hi,
      Thanks for the reply..I don't have much knowledge in HTML. Can you please provide me a complete procedure? Also, one more help I need : I've linked my blog with Google + and set everything to show my profile pic on search results...but it's not showing up! Only my name is appearing... they are appearing on some Regional Google (https://www.google.com.tr/search?output=search&sclient=psy-ab&q=josephstutorialshop.blogspot.com&btnK=)..! Any idea to fix this?

      Delete
    3. Hi,
      I don't have a complete procedure for this, other than the instructions in the blog post. Make sure you make a back-up of the template before and try it out yourself, it's the best way to learn.
      As for the other issue, I don't have a solution; in any case linking Blogger with the Google+ profile is no guarantee that it will show the profile in search results, it takes some time until Google indexes the change.

      Delete
  7. HI,
    i want to display no comments link on the right side in my. tell me what should i do for this

    ReplyDelete
  8. I tried but can't change 0 comments to post comments. Required help.

    ReplyDelete
  9. Thanks for your helpful article...its help me a lot.thanks again.

    ReplyDelete
  10. Hi! On my blog I started using Google+ comments only! I tweaked the Html so that only my google + section comments shows up!
    Now the problem I have is, no matter how many comments on google + I have, it still shows the "0 Comments" at the begining at my post! How can I fix this ? Thanks!

    ReplyDelete
    Replies
    1. Hi! Personally I don't have any experience integrating Google+ comments with Blogger.
      Since comments are on an external service, I don't think the data about the number of comments is sent back from Google+ to Blogger. The Blogger variables described in this article are only valid for Blogger comments.
      I guess it's possible to link the two through the Google+ and/or Blogger API, but I haven't worked with either of them...

      Delete
    2. I have the same problem. I have Google+ comments, but on the post, it still displays as No Comments. (http://www.growleadserve.com/2015/07/dear-new-teachers-or-teachers-new-to.html) Any fix you know of?

      Delete
    3. Hi Bob,

      I see the correct number of comments of the post you shared (2 comments in the header with link, 2 comments below the post). Have you fixed it in the meantime?

      Delete
  11. the easiest way to do that is by searching "comments" in the html. And then just look for it, delete the phrase 'o comments' or 'no comments'(depents on the template itsefl)

    ReplyDelete
  12. this didn't work for me. i couldn't find the code to replace.
    here is my test site: http://toothpickinahaystack.blogspot.com/
    i just want to remove the super big NO COMMENTS text on Page A.

    ReplyDelete
  13. thank for the post. :) Good post.
    is very useful and can be understood

    ReplyDelete
  14. Thanks for such an useful and informative post.

    ReplyDelete
  15. helo sir
    i want to change comment message [above comment box] inplace other word LIKE 1 comment > 1 answer
    plz help me.

    ReplyDelete
  16. use this code
    .comment-link{display:none}
    above ]]>

    ReplyDelete
    Replies
    1. That would remove all comments links from the blog, not what I had in mind. My solution allows links for the comments sections to still show when there are comments for posts, and hides links for posts with no comments.

      Delete
  17. Hey Geroge, I'm facing this weird error near the comments label, there's seems to be a red code saying something behind the actual comment count. Here i'm using this template and here's the demo page which clearly shows the error. http://codify.templateify.com/

    ReplyDelete
    Replies
    1. NVM, i fixed the problem, it was image which went bad, i removed that and now it's all fixed.

      Delete
  18. Thank you very much for this amazing post. Thanks

    ReplyDelete
  19. Hi. When using Google plus comments on a custom theme, the actual comment count doesn't appear on the label.. I installed google plus comments but it doesn't show..
    This is my tes blog- http://damsel98.blogspot.in/

    ReplyDelete
    Replies
    1. Hi. I've mentioned this elsewhere in the comments, but the Google+ comment count doesn't seem to be connected in any way to the internal Blogger count, so it's not possible to show the number of Google+ comments in Blogger widgets.

      Delete
    2. Thank you so much for replying!! :)

      Delete
  20. Very nice tutorial. Thank you very much

    ReplyDelete
  21. Hey! My blog is www.plainjane.in
    How can I change the 0 comments to just comments? :)

    ReplyDelete
    Replies
    1. Hey! It should be quite straightforward: instead of the text 'No comments' in the code above simply use 'comments'.

      Delete
  22. Hiya,
    I have installed disqus on my blog and people are commenting through it however on the main home page of my blog it says '0 comments' which is doing my head in because if you click on the post their are comments haha. Do you know how I could change this using the CSS? Is it in my template? or is it a disqus issue?
    Thanks!

    ReplyDelete
    Replies
    1. Hi,
      I don't think this can be changed either through CSS or through the Blogger template. The number of Disqus comments is external data, so you would most likely need to do some coding to access it through Disqus' API.

      Delete
  23. i am using a blog theme from bthemez.com will this still work to remove "0 comments" above each post?

    ReplyDelete
    Replies
    1. That depends on how much the theme modifies the standard Blogger template.
      You should open the theme in HTML mode and search for the code examples from my article. If you find them, there's a good chance you can apply this customization.

      Delete