How to add ‘comments counter’ after post title in blogger?

PhotobucketMake your visitors of blogger to know about your number of comments have encountered at the every specific post by adding the comment counters or comment counts widget to your blogger.This may lead to increase your comments as they show interest if there is already many comments to a specific post.I have alredy posted that comments are best way to increase traffic.






To add this ‘comments counter widget  at posts’ to your blogger follow my tutorials:-

Part1
1.Login  to blogger->> Design or Template->> Edit Html->>
2.Back up your template
3.Tick at Expand widgets box
4.search for the code  ]]></b:skin>
5.Add below code above ]]></b:skin>

.comments-button {
width : 48px;
height : 48px;
background : url(http://3.bp.blogspot.com/_vLeiVavkV_M/TRqeSsZYiYI/AAAAAAAADw0/NKcU4q-Vbq4/s200/comment-counter-bubble.png) no-repeat;
float : right;
font-size : 18px;
margin-top : -15px;
margin-right : 2px;
text-align : center;
padding-top:10px;
}
Part2
6.Now using ctrl+f shortcut key search the below code
<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
7.Now copy the below code and paste it above <b:if cond='data:post.link'>
<b:if cond='data:post.allowComments'>
<a class='comments-button' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
8.Save template and done.
9.Result of total code looks like this:
<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.allowComments'>
<a class='comments-button' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>

<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>

No comments:

Post a Comment

Please comment the message if you like post or any trouble