Posted by Prakash timilsina Saturday, January 23, 2010

Share
See Demo at the last of this post


Do you want to put this counter in your blog ?
If yes then just follow the below instructions :

*Step 1*
Login to blogger.com then Click on Layout >Edit HTML
Now Tick on the Expand Widget Templates

*Step 2*
Now Search

<b:loop values='data:post.comments' var='comment'>


then paste the below code Just ABOVE it.

<!--COMMENT COUNTER-->
<span class='comm-num'>
<a expr:href='data:comment.url' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
<!--COMMENT COUNTER-->


Now Search for

</head>


Now paste the below code just above this


<style type="text/css">
.comm-num a:link, .comm-num a:visited {
color: white !important;
text-decoration: none !important;
background: url(http://i50.tinypic.com/egx3t3.jpg) no-repeat;
width: 50px;
height: 48px;
float: right;
display: block;
margin-right: 5px;
margin-top: -15px; /*comments-counter position*/
text-align: center;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 15px;
font-weight: normal;
}

.comm-num a:hover, .comm-num a:active {
color: gray !important;
text-decoration: none !important;
}
</style>




Now the red colored code should be replaced by you.
Just change the url for ur choice image .






 
































Now just save Template and enjoy :)
thankx [BloggerStop.Net]

2 comments

    v
  1. this is the DEMO for this post :D see in the top right corner of this comment

      Posted on January 24, 2010 at 6:46 AM
  2. Aryal Suran Says:
  3. Nice work!! Love ur Blog........................ :))

      Posted on June 15, 2011 at 7:40 AM
:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

Goto Top