Saturday, August 13, 2011

HOW TO ADD COMMENTS COUNTER BUBBLE TO GOOGLE BLOGGER

,

BLOGGER NEED TO SEE THE VISITOR COMMENTS OF HIS BLOG. AND ALL VISITOR CAN SEE THAT HOW MANY VISITOR AL READY POST COMMENTS ABOUT THE POST. GOOGLE BLOGGER  NEED TO CHANGE SOME CODING IN HIS BLOGSPOT BLOG TEMPLATE TO SHOW COMMENTS BUBBLE ON HIS BLOG POST. HERE I’ LL SHOW YOU HOW TO ADD A COMMENTS BUTTON ON BLOG POST. 

1. LOG IN BLOGGER DASHBOARD :





2. CLICK ON DESIGN :
3. CLICK ON EDIT HTML:
4.TO SAFE YOUR BLOG FROM ANY UNWANTED MODIFICATION, PLEASE BACK UP  YOUR BLOG BEFORE CHANGE IT.






5. TO ADD LIKE ABOVE COMMENTS BUBBLE, CAREFULLY READ AND FOLLOW INSTRUCTION GIVEN BELOW:

6.CHECK THE ‘EXPAND WIDGET TEMPLATES BOX’
7. FIND  THESE CODE IN CSS SECTION:
]]></b:skin>
8. BEFORE ABOVE CODE PASTE THE FOLLOWING CODE:
.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;
}
 


 9. NOW FIND THE FOLLOWING 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'>


10. PASTE THE FOLLOWING CODE AFTER ABOVE CODE:





<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>

11. NOW SAVE THE TEMPLATE.






4 comments to “HOW TO ADD COMMENTS COUNTER BUBBLE TO GOOGLE BLOGGER”

Post a Comment

< DEAR FRIENDS IF YOU THINK THE SITE USEFUL FOR YOU PLEASE DON'T FORGET TO LEAVE A COMMENT

 

BLOGGER TIPS TRICKS Copyright © 2011 -- Template created by O Pregador -- Powered by Blogger Templates