Latest: Download Free Desktop Wallpapers of Chef Loony! | Series: AuthorRank? | Download MBT eBooks!

Add Comment count to Post Header Titles in Blogger

0 comments
Add Comment count to Post Header Titles in Blogger
You noticed the number of comments displayed in comments section inside each posts. It is placed under the post. It is not noticeable to visitors. Do you want to add it to header to inspire your visitors to comment. The visitors only see the comment count when they reach at the end of the post. if the visitor not scroll to footer part , the comment count will not see.
Do you think about displaying comment count on the top of post will be better? Then here we are showing a technique to add comment count with beautiful backgrounds to the header part of the post, not only inside the post but also it will display to homepage.


After adding his trick the comment count will be displayed with post titles , if more comments on the post, it will encourage the users to comment and also helps to jump to comment section.


How to add Comment count to Post Header

  • Sign In to Blogger Dashboard
  • Go to Template -> Edit HTML
  • Find (Ctrl+F) ]]></b:skin> and copy the below code above it
.comment-count {
float : right;
width : 48px;
height : 48px;
background : url(  IMAGE URL  );
background-repeat: no-repeat;
font-size : 18px;
position:absolute;
margin-top : -15px;
margin-right : 2px;
text-align : center;
} 

 Choose the comment count background

  • Copy the URL of image you want by right clicking and select Copy image Location or Copy Image URL.
  • Replace the RED marked portion above with the image URL


      Bubble Comment Count in blogger     Bubble Comment Count         Add Bubble Comment Count    Bubble Comment Count  Bubble Comment Count   bubble comment blogger    bubble comment blogger     bubble comment blogger        blogger tips, blogger tricks    blogger widgets, bubble comment count         blogger comments, comment count          

 Add Comment count code

  •  Find the following code 
 <h2 class='post-title entry-title' itemprop='name'>
 or
 class='post-title entry-title'
  •  Add the following code below it
<b:if cond='data:post.allowComments'>
<a class='comment-count' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
  •  Save Template
Congratulations you have done. Check your blog and get more comments. If you liked this article please like and share this blog.

No comments:

ctika

adserum 2

adserum 1

  • MBT Icons and buttons

    Icons and Buttons

    Our resources have been successfully downloaded over 10K times and found almost every where. Get yours!

  • choosing webhost for a blog

    Why HostGator?

    Learn Why we chose HostGator as our Web Host and find discount coupons to kick start your blog today!

  • SEO Settings for blogger

    ALL IN ONE SEO PACK 2012

    Learn every single SEO tip that will boost your blog's ranking and organic traffic. We got them all!

  • Blogger widgets and plugins

    Visit MBT's Blogger LAB

    Why not take a tour of all great Blogger widgets published so far? You Name it we have it!

  • become a six figure blogger!

    Become a SIX FIGURE BLOGGER

    Learn what it takes to become a successful entrepreneur and build a living online!