Latest News

Theme images by merrymoonmary. Powered by Blogger.
Sunday, 23 April 2017

How To Add A Comment Bubble Just Next To Blogger Post Titles

If you want to show the number of comments just next to your blog post tiles then comment-bubble is a best way to show number of comments to that particular post in a small bubble icon.This little bubble will also increase the number of comments on your blog,because by clicking on the bubble your readers can directly access the comment-form of that post.Also you can add this in two easiest ways,just follow below steps carefully and you will easily add this to your blog.

How To Add Comment Bubble Just Next To Post Title?

Go to Blogger Dashboard > Template
Take a backup of your template
Click On Edit HTML
Hit Proceed
Check Expand Widget Templates chechbox.
Find below code in your template


add below code just above it

.comment-bubble {
    float: right;
    width: 48px;
    height: 48px;
    background: url( no-repeat;
    font-size: 18px;
    float: right;
    margin-top: -15px;
    margin-right: 2px;
    text-align: center;
    position: float;
    text-align: center;

Now find for below code in your template

<b:if cond=''>

replace it with below piece of code,

<b:if cond='data:post.allowComments'>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
<b:if cond=''>

Now take a preview of your template,if you want to adjust the position of comment bubble then you can change the above CSS values as you need.When you feel that everything is ok then save your template.You can also replace the bubble with your own bubble,just replace the URL of bubble with your own bubble URL.

Posted in: Blogger Tricks
  • Blogger Comments
  • Facebook Comments
Item Reviewed: How To Add A Comment Bubble Just Next To Blogger Post Titles Description: Rating: 5 Reviewed By: Rd Singh
Scroll to Top