Numbering Comments In Blogger/BlogSpot Blogs

Here comes the first Blogger tutorial in year 2010 on BloggerStop. This Blogger hack will add numbers against all the comments in your blog. And each number will be linked to that unique comment. You/your readers can use these numbers and corresponding links to mention or point a particular comment on any of your posts.
Numbering Comments In Blogger

Working Demo - Hot Orange Blogger Template.

Instructions To Follow:
STEP #1
Log in to Blogger, go to Layout -> Edit HTML
and mark the tick box "Expand Widget Templates"

STEP #2
Now find (CTRL+F) this code in the template:
<b:loop values='data:post.comments' var='comment'>
Immediately ABOVE/BEFORE that, paste this code:
<script type='text/javascript'>var CommentsCounter=0;</script> <!--COMM-NUM-STARTS-->
Now find this code:
<data:commentPostedByMsg/>
And immediately BELOW/AFTER it, paste this code:
<!--COMM-NUM-STARTS-->
<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>
<!--COMMNUM-STOPS-->
And save the template. Now you will see numbers in front of all the comments in your blog. But they are not well styled.

STEP #3
So now we will style these numbers to match your blogs theme.
GO back to the page Layout -> Edit HTML
and find (CTRL+F) this code in the template:
</head>
And immediately ABOVE/BEFORE it paste this code:
<!--COMM-NUM-STARTS-->
<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>
<!--COMM-NUM-STOPS-http://bloggerstop.net-->
Edit the above code (highlighted in RED) to change the image.
And edit the code (highlighted in BLUE) to change the color of the numbers.

Images you may use (Right-Click and select "Copy Image Address/Location"):














IMPORTANT: You may use any image instead of the one linked in the code above (STEP #3), but you have to mention its dimensions correctly (width and height) for correct placement of numbers on the image.

Finally save the template and count your comments...


Via QuiteRandom & Webaholic

ProBlogger - Inspiring Others Realize Their Dreams!

Share this

Related Products

Related Posts

Previous
Next Post »

177 comments

Write comments
P.T
January 05, 2010 10:32 AM delete

It's not working on mine...:(

Reply
avatar
January 05, 2010 10:49 AM delete

@P.T.
I couldn't find the code in your template. Leave the code as it is, so that I can it for errors. BTW ...nice template.

@Анна
Thanks. If you are using some other icon (when I checked your blog, it was blue bubbles icon), then make sure you also change the dimensions (width and height)-For that blue bubbles icon dimensoins are 55x53 (55-width & 53-height).

Reply
avatar
Lex
January 05, 2010 10:52 AM delete

Beautiful icons...thanks.

Reply
avatar
January 05, 2010 11:01 AM delete

I can't find the said lines in my template! :((

Reply
avatar
January 05, 2010 11:17 AM delete

@Magali
Out of these two lines:
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>


If first one's not there in your template, then find only the second line, and paste that code (in red) just above it.

Reply
avatar
January 05, 2010 11:25 AM delete

This is a great idea. I have numbers on my comments but no images yet (my choice right now).

You can adjust how high the number are by changing the -15 in the command margin-top: -15px;

I believe I adjusted mine to be -23px.

Great job with the coding!!

Reply
avatar
January 05, 2010 12:47 PM delete

Thanks for adding that point Kristy.
So as mentioned by Kristyanna, if you want to adjust the position of the icon+number, then change the values against margin-right and margin-top. Also you can change the font-size of these numbers.
And, to make the numbers bold, change this:
font-weight: normal;
to this:
font-weight: bold;

Reply
avatar
January 05, 2010 1:29 PM delete

wow....awesome hmmm...:X

Reply
avatar
January 05, 2010 2:49 PM delete

here's Divya http://ben-tools.blogspot.com/2010/01/minifesto.html :D my add this trick :X

Reply
avatar
January 05, 2010 2:57 PM delete

That's great Beben, I think you can make the font more bold.

Reply
avatar
January 06, 2010 1:59 AM delete

Thanks 4 sharing. I will try.

Reply
avatar
January 06, 2010 8:40 AM delete

I am not able to find this code in my blog

Reply
avatar
January 06, 2010 8:55 AM delete

Hi Poras, make sure that you have ticked the box "Expand Widget Templates" and read my reply to Magali's query. Anyways I'll update the post too.

Reply
avatar
January 07, 2010 1:53 AM delete This comment has been removed by the author.
avatar
January 07, 2010 1:56 AM delete

Hi, Divya Sai
I cannot find this code <data:commentPostedByMsg/> in my template. what should i do now?

Reply
avatar
January 07, 2010 3:02 AM delete

I am also having the same problem as Divine Brahmanda

& (I am not able to write html codes in comment form also in your blog.)

Reply
avatar
January 07, 2010 5:31 AM delete

The overall code will look similar to this in your blog (code varies from template to template), the bolded part of the code is what you to add:

<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
<!--COMMNUM-STARTS-->
<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>
<!--COMMNUM-STOPS-->

</dt>

Reply
avatar
January 07, 2010 12:56 PM delete

Thanks Divya Sai

It Is Perfectly Working In My Blog Now.

Reply
avatar
January 07, 2010 1:04 PM delete

That's great, happy for you Poras :)

Reply
avatar
January 07, 2010 3:01 PM delete

Divya,
Thanks for your advice, now looks much better. :)

Reply
avatar
January 07, 2010 3:20 PM delete

@Анна
Yeah they are looking great on your blog...BTW you have some really delicious bakery pics on your blog :)

Reply
avatar
January 08, 2010 5:01 AM delete

Wow, more images means more time to load, but I think this is acceptable!

Reply
avatar
January 08, 2010 9:16 AM delete

Well no Reza, it will not at all add any significant load to our blogs html. its just a single image of hardly 2/3kb which is repeated in all the comments, so it doesn't mean that for 200 comments you reader/any one is going to download the 200 images, the query for download is sent only once, and due the code the image will be displayed 200 times.

Reply
avatar
January 12, 2010 7:51 AM delete This comment has been removed by a blog administrator.
avatar
Jos
February 24, 2010 3:18 PM delete

Haven't been able to use your most commented post widget, but this numbered post tweek is working fine!
Thanks, indeed.

Reply
avatar
February 24, 2010 3:35 PM delete

My site, it's coming up to far too the right. how can i move the number over to the left?

thanks.

Reply
avatar
Anonymous
February 25, 2010 3:28 PM delete

Ah excellent news, I like this one... thanks a lot!

g

Reply
avatar
March 14, 2010 1:21 PM delete

Thanks so much! This worked beautifully :O)

Reply
avatar
March 28, 2010 11:44 AM delete This comment has been removed by the author.
avatar
March 28, 2010 11:48 AM delete This comment has been removed by the author.
avatar
March 30, 2010 6:26 PM delete

Super! Thank you thank you! I tried several tutorials and this is the only one that worked for me. Thanks for sharing :)

Reply
avatar
May 17, 2010 9:00 AM delete

Thank you so much for this excellent tutorial! I used it on my blog and it worked great!

Reply
avatar
May 17, 2010 9:52 AM delete

Glad to help you Susan... :)

Reply
avatar
.
May 19, 2010 7:48 PM delete

I am unable to locate either of the 2 codes that I need to change in Step 2. Can you take a look, and let me know if you have any suggestions?

http://frugalinvitation.blogspot.com/

Reply
avatar
May 20, 2010 12:30 AM delete

Are you sure, you ticked the tick-box "Expand Widget Templates" ?

Reply
avatar
.
May 20, 2010 5:57 PM delete

I think it's because I'm using DISQUS as my comment host.

Reply
avatar
June 13, 2010 9:58 PM delete

Good trik my friend...
May I repost this trik in my blog?
Thanks before

Reply
avatar
June 14, 2010 11:40 AM delete

You are welcome
Please do not copy word-by-word
And DO give the credits to my blog as an active backlink to BloggerStop.net

Reply
avatar
July 03, 2010 6:39 PM delete

I just used this how to on my blog and "LOVVVVVVVVED IT.Come on who wouldn't.It adds style to the comment.

I just wrote a little post about this comment and linked to this post 2 times.

Reply
avatar
July 04, 2010 3:23 AM delete

Hi Dawn,
I'm really glad to know that. I have replied to your mail...hope that clears your doubt.
Have a great weekend.

Reply
avatar
July 19, 2010 12:46 AM delete

Hey thanks for this worked ...except I couldn't get the styled part...the image wouldn't show and the numbers dissapeared..maybe I did it wrong? This is def a must for giveaways!!

Reply
avatar
July 22, 2010 9:18 PM delete

I was able to get numbers and images, however the numbers are all 1. They don't go up from there...LOL. Please help!

Reply
avatar
July 24, 2010 2:32 AM delete

sorry but i can't find this code



can i add it?

thanx

Reply
avatar
July 24, 2010 2:34 AM delete

sorry but i can't find this code

can i add it?
pls help, thanx :)

Reply
avatar
August 04, 2010 5:19 PM delete

Awesome! I tried so many other codes and this is the first to actually work! Thanks.

Reply
avatar
August 14, 2010 3:55 PM delete

By far the easiest tutorial I have found for this. Worked on the first try! :D

Reply
avatar
August 14, 2010 4:23 PM delete

Glad to know that ...happy for you :)

Reply
avatar
August 24, 2010 10:53 AM delete

thank you for this! it worked for me (but I didn't stylize -- I don't mind the boring numbers). ;)

Reply
avatar
August 26, 2010 8:15 PM delete

thank you for the tutorial! I tried a few others before finding yours and couldn't make the others work. But yours was a cakewalk!!! Although before I stylized I surprisingly still had an image for the number and I would have been ok with just a number. Actually I'd prefer it without any fancy styling image but what I have now does what I need it to and html gives me a headache lol

Reply
avatar
August 29, 2010 2:28 AM delete

mahalo! your step by step instructions were great!

Reply
avatar
September 01, 2010 10:18 AM delete

Everything is showing up EXCEPT the numbers on mine. The photo is loading, but not the numbers. )= Does anyone know what that means?

Reply
avatar
September 05, 2010 5:48 AM delete

Thank you!
I was wondering for some time how to do this!!!

Reply
avatar
September 06, 2010 12:15 AM delete

thank you! i have been wondering how to do this =)

Reply
avatar
September 06, 2010 4:37 AM delete

Glad it helped you all :)

@Ashlee, plese send me your template via my contact page, so that I can check it for you.

Reply
avatar
September 08, 2010 10:55 AM delete

how to center the number of comments like in ur blog?
in my blog, the position is not centered like in here
help please :(

Reply
avatar
September 08, 2010 11:04 AM delete

Hi there,

Change this code:
background: url(http://i47.tinypic.com/2nhnk82.jpg) no-repeat;
width: 50px;
height: 48px;


to this:
background: url(http://i47.tinypic.com/2nhnk82.jpg) no-repeat;
width: 43px;
height: 47px;

Reply
avatar
September 12, 2010 9:59 PM delete

Thanks so much! It was so easy and i got it perfectly right the first time !!

Reply
avatar
September 15, 2010 1:17 PM delete

oh my god, i tried 4 different tutorials for this and none of them worked! they all wanted me to find code that wasn't in my blog code. this one was so easy! thanks a BUNCH!

katie
www.kateandoli.com

Reply
avatar
September 15, 2010 1:46 PM delete

@Esther
Welcome

& Glad to know that Katie :)

Reply
avatar
September 19, 2010 7:03 AM delete

Ok! I followed, got the numbers. Don't mind them being unstyled...as they are Yellow and and match my font. HOWEVER, all I got were #1's It didn't count up. Any ideas?

sunshinepraises.blogspot.com

Reply
avatar
September 19, 2010 7:35 AM delete

Hi Melanie,

You haven't added the code from Step #3, so there's no styling to the numbers,
And I just checked your blog and found the numbers going in the correct order 1,2,3...

Regards

Reply
avatar
September 20, 2010 6:00 PM delete

This tutorial rocks! Thanks for making it so easy to follow and install :)

Reply
avatar
September 28, 2010 4:40 PM delete

Is there a way to get the numbers to go over 200 comments, without starting at 1, when it should be 201?

Reply
avatar
October 15, 2010 2:07 AM delete

I have used these steps many times. Recently I selected a different blogger template and now when I try to apply these steps I am still not able to get my comments to be auto numbered. I'm stumped.

SewCalGal
www.sewcalgal.blogspot.com

Reply
avatar
October 15, 2010 4:01 AM delete

Hi there,

Just checked your blog and the numbering is working perfectly. I hope you have fixed your problem... :)

Reply
avatar
October 15, 2010 8:28 PM delete

SAI I'm still not seeing the comments being numbered. But it sounds like you are. Very strange. Any advice as to why I can't see numbered comments?

SewCalGal
www.sewcalgal.blogspot.com

Reply
avatar
October 15, 2010 9:00 PM delete

Thanks. Finally have it working (again). Now just need to find a cute image for the number counter, that will work for quilting, sewing, embroidery enthusiasts. But I'm happy to have my comment counter back working.

I so appreciate your help and all your insights, very much!

SewCalGal
www.sewcalgal.blogspot.com

Reply
avatar
October 19, 2010 1:54 PM delete

Hi! thanks for this. I'm having trouble with the comments pop-up window though. the numbers are not appearing on the pop-up comments page. But if you comment on the main page it does. is there something I need to adjust?

Reply
avatar
October 19, 2010 2:07 PM delete

That pop-up is not a page from your blog, rather if you check the url of the pop up you'll notice that it's a blogger.com page. So this hack can never be shown there.
I would advise you to embed your comment-form in your blog itself:
http://bloggerstop.net/2008/10/how-to-embed-comment-form-below-posts.html

Reply
avatar
October 20, 2010 6:32 PM delete

Muchas gracias! I desperately needed to know how to do this, and it works like a charm.

Reply
avatar
October 22, 2010 9:01 AM delete

Thank you so much!!!. I had tried this at another site, but their directions were so hard that I messed it up. You made it so simple and I thank you for that.

I do have one question. Does this keep numbering, or does it stop at 200, and if it stops at 200,... How do I get it to go further.

Thanks Terry
My Journey With Candida

Reply
avatar
October 26, 2010 10:09 AM delete

Thank you so much for this! I have been wanting to do this for quite a while and your instructions were so clear and easy to follow!

Reply
avatar
November 08, 2010 2:38 PM delete

it worked, thanx!!! http://www.fashionablenotebook.blogspot.com

Reply
avatar
November 08, 2010 2:43 PM delete

Happy for you Nancie :)

@Terry
The comments on each page start from 1 (in Blogger, it is fixed that comments are shown till 200 on a single page & we cannot change that)

Reply
avatar
November 08, 2010 7:47 PM delete

FINALLY!!!! I have been searching all evening and trying codes with no luck. It was because I'm using one of the new blogger templates (Picture Window) and all of the code changes that I found wouldn't work with the new templates. I just followed this step by step and IT WORKED!! Thanks so much!

Reply
avatar
November 09, 2010 12:36 AM delete

I'm having an issue. The numbered comments will show up in Firefox but nothing shows up in Internet Explorer. Anyone know how to fix this?

I'm working on a hidden blog but will be glad to send the codes to someone who might could help.

Reply
avatar
November 09, 2010 9:33 AM delete

Ok, I tried tweaking a little more in IE. The numbers WILL show up before I add styling, but disappear after I add the style code.

I would really appreciate any help! I've tried several other codes (with no luck) and this is the one I like best!

Reply
avatar
November 11, 2010 10:51 AM delete

Thank you so much for sharing your tips and tricks. Not only are your directions straightforward and easy to use. I really didn't feel at any point that I was going to loose all HTML formatting like I usually do when I need to go in and add something to my blog code. I finally have numbered comments back on my blog. Now I just need to find an image that is more in keeping with my blog to use as the comment icon.

I am going to repost with thanks to you and your blog (with links back here)so my readers can use your method for adding comment numbering to their blog.

Reply
avatar
November 11, 2010 12:28 PM delete

I am glad this helped you Felissa. And thanks a lot for spreading the word :)
For the time being, you may use (any of the 3) sky blue colored icons I think.

Reply
avatar
November 11, 2010 7:22 PM delete

Ok, for anyone interested in knowing, I figured out why it wasn't working in IE but was in Firefox, at least for me. Apparently, you have to go under Settings, then Comments. You have to choose NO to showing profile pictures. I don't know why, but that's what finally worked for me. So that's what finally worked (in case someone out there runs into the same issue). Hope that helps!

Reply
avatar
November 11, 2010 10:42 PM delete

@Courtney,

Wow that was quite an unexpected and unusual fix to your problem
I am glad you fixed it yourself and thanks a lot for sharing your experience and this fix with others.
Have a great weekend ahead... :)

Reply
avatar
November 16, 2010 7:22 PM delete

Thanks a million. Your blog was the only one to show this in an easy and helpful manner. I didn't even use the styling technique. It looks great without it.

Romeo

Reply
avatar
November 18, 2010 2:09 PM delete

Hi there I am new. I have installed intense debate on my comments. I have so many problems with my comments I am about in tears struggling with this.
This is what I would like:
A comment box that like the one I'm writing in right now.
I followed your steps and nothing worked. No numbers, no cute pictures.
And when I click on "comments on my page, it takes you to the top of the page and I have to scroll down to the comment box. I am so confused. Could you help me please?
geneveve2@gmail.com

Reply
avatar
November 18, 2010 2:11 PM delete

http://grandma-sez-so.blogspot.com/
I just posted and this is my new blog. I really need a numbered comment box.

Reply
avatar
November 18, 2010 6:23 PM delete

Hey, it's me again.
I got it. I had to get a new template, I guess, thank you for the instructions.

Reply
avatar
November 26, 2010 6:27 PM delete

yeah! loving your blogger hacks. This one totally worked!

Reply
avatar
Jen
December 09, 2010 9:52 PM delete

Thanks for posting! I've been putting off closing out a giveaway because I would have had to count. I got the numbers to work, but not the images. Will try again in a bit.

Reply
avatar
December 12, 2010 11:23 AM delete

how did you put the feather on your comments?

Reply
avatar
Anonymous
December 27, 2010 8:45 AM delete

hola, soy Lationamericano, y te agradezco por tu ayuda, este truco me funcionó muy bien, gracias por tu ayuda, y un saludo desde un muy bello pais del mundo

"Colombia!!!"

Thanks for your help!...

Reply
avatar
December 30, 2010 9:37 AM delete

hello ..
all your given coding works perfectly in my template except for one thing -- all my comment is numbered as #1

how do i fix this ?

you can check out this problem at my (and only) post page which have comments :

http://mediamaniiac.blogspot.com/2010/12/this-is-testing-post-pge-edit-it-or_28.html

thanks in advance

Reply
avatar
December 31, 2010 2:02 AM delete

hello again ..
i had fix my error ..
thanks ..

Reply
avatar
January 02, 2011 7:22 AM delete

Hi there, I did the changes as you mentioned, but mine does not even show up, please could you help me out.

Thanks!
Sophia
http://sallison.blogspot.com/

Reply
avatar
January 02, 2011 7:51 AM delete

Never mind it seems to be working perfectly, thank you so much!!!

Reply
avatar
January 03, 2011 2:07 AM delete

mas..
nmor saya kok g kluar..
tpi gmbarnya kluar

Reply
avatar
January 04, 2011 11:44 PM delete

I cannot tell you how many tutorials i have read through tonight that didn't work or were so confusing I was almost in tears. Luckily I found this one and it worked perfectly the first time. Your directions were so easy and I LOVE the idea of the pictures to put the numbers in. I simply cannot thank you enough!!!!

Reply
avatar
January 08, 2011 2:41 AM delete

Thank you for sharing your ideas. Indeed, this is ver informative blog and well presented in terms of intructions.

More power to you...

Reply
avatar
January 08, 2011 2:55 AM delete

@ilovepink1078

After adding the images, make sure to change the height and width values for the new images - otherwise the numbers won't be placed at the center as they should.

Reply
avatar
January 08, 2011 3:38 AM delete

Thanks for sharing your talent. Indeed, this is very informative blog and well presented in terms of instruction.

More power to you...

Reply
avatar
January 08, 2011 3:38 AM delete

can u tell me how did u put the feather in your comments, please?:)

Reply
avatar
January 08, 2011 4:14 AM delete

In your blog, change this code:

.comment-body-author {
background: #ADD8E6;


to this:

.comment-body-author {
background: url(http://oi50.tinypic.com/2ltho36.jpg) no-repeat #ADD8E6;

and save template. You will have to change the background color (around the feather) to match that of your surrounds - blue.

Reply
avatar
January 08, 2011 4:46 AM delete

wow, thanks.
Now I got this other problem : if the comment-body is short, the feather is cut. can u tell me how to fix this problem?

Reply
avatar
January 08, 2011 5:11 AM delete

Sorry forget to mention that, you have to maintain a minimum height of 65 pixels in your comments boxes. Add this code to do that:

.comment-body-author {
background: url(http://oi50.tinypic.com/2ltho36.jpg) no-repeat #ADD8E6;
min-height: 65px;

Reply
avatar
January 08, 2011 5:28 AM delete

thanks!! you're a genius ;;)

Reply
avatar
January 16, 2011 4:16 AM delete

well, well, well, how can I stop browsing your pages if you have nice helpful tips in each of them? ;)) very well tips Sai! Thanks!

Reply
avatar
January 27, 2011 1:36 AM delete

Great.This is one of those informative posts i get interested reading with.

Reply
avatar
January 30, 2011 11:49 AM delete

Referred over here from 733 blog! I love this tutorial! It was super easy to follow. I tried adding my own image, and the image appears but the numbers do not. Any ideas? I do have the appropriate width and height for my image.

Thanks! :)

Reply
avatar
January 30, 2011 11:55 AM delete

I got it! :) Just had to change the color at the top of the code.

Reply
avatar
January 30, 2011 1:32 PM delete

Hi Erin, nice work...btw when I checked your blog, you removed the background....is it the way you want or was there any issue with the code?

Reply
avatar
February 02, 2011 11:28 AM delete

Hi! This is great! Thanks! I got it working on my blog using my own image, but would really like it if I could get the number to be centered in my image, not on the top. Any ideas??
Thanks
Ashley
www.simplydesigning.blogspot.com

Reply
avatar
February 02, 2011 2:05 PM delete

Hmm although you have done most of the steps right, but either make the font size smaller (to 15px from 25 px)
or change this value:

margin-top: -15px; /*comments-counter position*/
text-align: center;

to this:

margin-top: -5px; /*comments-counter position*/
text-align: center;

Hope that works, do tell me...

Reply
avatar
February 03, 2011 8:24 AM delete

Thank you for the tutorial, I finally have my comments numbered!
http://jencrum.blogspot.com

Reply
avatar
February 07, 2011 5:56 AM delete

i have a little problem. i can't see my comments number after my post title like the "5 comments"..please help

Reply
avatar
February 08, 2011 11:36 AM delete

Dear Sal~
I have tried several times to install your code, but still can't see any numbers. But I'm wondering if it's because my template has the little avatar images on the right side already? Is there any way you could help me figure this out? I'd really like to know how to make regular numbers inside a simple black circle show up on the left side instead of the right, if possible?
www.loribergmann.blogspot.com

Reply
avatar
February 08, 2011 11:42 AM delete

Okay, forget what I said about putting the numbers on the left! LOL Is there a way to move my avatar pics to the left and then can see the numbers on the right side? *Ü*
www.loribergmann.blogspot.com

Reply
avatar
February 08, 2011 11:44 AM delete

Hello there,

I can see the number-bubbles in your blog. The black clouds with numbers in them. Glad you fixed the problem yourself :)

Reply
avatar
February 08, 2011 11:47 AM delete

Dear Sal~
That's really weird, because I can't see them at all?!

Reply
avatar
February 08, 2011 11:48 AM delete

In your blog, I can see the avatar images in the left and number bubbles in the right - just the way it should be...
Wait a minute I'll show you a screenshot of your blog...you can get it verified by your friends.

Reply
avatar
February 08, 2011 11:52 AM delete

Here's the screenshot:
http://i.imgur.com/9vEYk.png

Reply
avatar
February 27, 2011 12:26 PM delete

When I use an image of my own, the numbers don't show up. What am I doing wrong?

Reply
avatar
March 02, 2011 1:51 AM delete

Wordpress - How do I get the number of comments at the top of my blog?

Reply
avatar
March 19, 2011 10:05 PM delete

I was able to add numbers to my comments on my blog in the default color. However, I would love to change the color to the brown bubble but I don't know the size, etc.. How can I change the color? And thanks for the step by step instruction! :)

Reply
avatar
April 01, 2011 3:02 AM delete

mmm there is something I am doing wrong because all of my comments are showing as #1 .....
Help pls???
www.onesmileymonkey.blogspot.com

Reply
avatar
April 10, 2011 7:50 AM delete

.comment-body-author {
background: url(http://oi50.tinypic.com/2ltho36.jpg) no-repeat #ADD8E6;
min-height: 15px; /* Background color*/
color: #000; /* Text color*/
border-top: 1px dotted #ADD8E6;border-bottom: 1px dotted #ADD8E6;border-left: 1px dotted #ADD8E6;border-right: 1px dotted #ADD8E6;
margin:0;
padding:0 0 0 20px; /* Posotion*/
}

Reply
avatar
April 11, 2011 2:55 PM delete

nice info brther, thanks you.

Reply
avatar
Wickramma
April 28, 2011 6:07 AM delete

I also have the same issue as somw of you.. Comment numbers shown as 1 always.. it is not increasing ? Can some one assist ?

Reply
avatar
May 19, 2011 2:15 PM delete

It's not working on mine... :(

http://madewithlof.blogspot.com

Reply
avatar
May 22, 2011 3:15 PM delete

YAYAYAYAAAAA!!!!! After trying multiple other tutes that didn't work for me since I have the "newer" blogger version, this one did!!!! THANK YOU SO MUCH!!!!! :)

Reply
avatar
June 24, 2011 3:30 PM delete

This was the easiest to follow tutorial I have found and it worked PERFECTLY! Thanks a bunch!

Reply
avatar
July 05, 2011 8:25 PM delete

My numbers are showing up twice - that is, in one place all of the odd numbers, and the same comment is also marked with the consecutive even numbers. What do I do?

ninthstreetnotions*at*gmail.com
http://ninthstreetnotions.blogspot.com

Reply
avatar
Rie
July 14, 2011 7:49 AM delete

This is an awesome Tutorial, so easy - I did it in 15mins (after trying a few things out!). Thanks so much!

Reply
avatar
July 21, 2011 12:49 PM delete

Thank you ! Thanks a lot! It worked!

Reply
avatar
July 24, 2011 7:59 PM delete

Thank you so much! I've tried other tutorials to do this but none of them worked and none had pictures or colors you could change!

Reply
avatar
July 30, 2011 5:19 AM delete

Many many thanx for this post. i’ve looking around for things like this…great job !!!

Reply
avatar
August 07, 2011 10:20 AM delete

Thanks for your tip. However, it only shows number in my comments, the number does not appear in visitor's comments. How can I fix it?

Reply
avatar
August 20, 2011 4:16 PM delete

Thank you so much for the great step by step process. It worked great!

Reply
avatar
September 13, 2011 4:24 AM delete

hello there
I posted your blog to my site Golden Root
Regards

Reply
avatar
October 10, 2011 5:25 PM delete

This is really great, thank you for sharing!

Reply
avatar
SEO
November 10, 2011 3:31 AM delete

My spouse and I absolutely love your blog and find many of your post’s to be exactly what I’m looking for. can you offer guest writers to write content for yourself? I wouldn’t mind composing a post or elaborating on a number of the subjects you write regarding here. Again, awesome website!

Hollywood Studios

Reply
avatar
November 18, 2011 6:22 PM delete

Thanks so much...like others have said, I've tried other hacks and none of them have worked until yours. Bravo!

I do have one problem...the image is cut off on the right margin. I noticed that someone else had mentioned in the comments that they had the same problem, but I never saw a fix for it.

Can you help?

Thanks,
Pam

Reply
avatar
November 28, 2011 2:48 AM delete

Thank you so much regarding the above post. I am looking the same thing very long times.
Can you tell how to design the comments.
My Blog is Here

Thanks

Reply
avatar
December 13, 2011 12:47 PM delete

Should yahoo remove thumb downs from yahoo answers and news comments?

Reply
avatar
December 22, 2011 6:14 AM delete

Thank you!!!! work perfectly.

Reply
avatar
December 26, 2011 1:29 PM delete

Should yahoo remove thumb downs from yahoo answers and news comments?

Reply
avatar
January 06, 2012 5:47 PM delete

I couldn't get this to work, at least with the first part of the code.
And, after I save template is it supposed to show numbering on previous posts or only on posts added after code added?
For the second part, I don't want to use any image, what can I do instead?
I have reverted back to the original template for now. Will make changes & add numbering after I receive your reply & clarifications.
Thanks so much!

Reply
avatar
January 13, 2012 9:58 AM delete

Having trouble! Did everything exactly as you said, but still no numbers showing up on my comments - help please?
http://faeroticprose.blogspot.com
(if I get it figured out on this blog, I have 2 other blogs to do it on)

Reply
avatar
January 22, 2012 10:29 AM delete

This didn't work for me either. Tried it twice. I know last year I did this but it was waayyy easier. Just had to put in numeric fields in certain places. It wasn't this difficult. Don't know why it didn't work for me.

Reply
avatar
January 26, 2012 1:30 PM delete

Hi, I tried adding this code, but it is not working for me. In fact, I used to have numbered comments as recently as 3 weeks ago, but they disappeared on me one day and I have not been able to get them back. Do you think Blogger has done done something or did I mess it up somehow?
Thanks for your help ~Jamie
http://scatteredthoughtsofasahm.blogspot.com

Reply
avatar
January 26, 2012 1:34 PM delete

I just realized, maybe my numbered comments disappeared when blogger rolled out the threaded comments... Anyway, not having numbered comments makes it hard to host giveaways. I had to count mine manually this am. Luckily there were only 35...

Reply
avatar
February 17, 2012 1:59 PM delete

Hi, I just tried this and it made my whole blog disappear. ??? thanks though. Does it not work anymore since blogger has changed everything?

Reply
avatar
February 23, 2012 9:46 PM delete

I harmonise with your conclusions and will thirstily look forward to your next updates. Just saying thanks will not just be enough, for the exceptional clarity in your writing.

Reply
avatar
April 11, 2012 7:22 PM delete

Oh no! I tried this and now I do have numbers, but it's skipping numbers...first comment says 1, second says 4, third says 7, etc...so even though I only have 16 comments, it says the bottom one is 46! Anyway you can offer help? Happy to email you my template code if that would help!

Reply
avatar
April 23, 2012 10:48 PM delete

I had used your tutorial successfully, but my numbered comments disappeared. I've tried to go back in and verify your code is in my blog, but still can't get the numbered comments to appear. Sure wish I could figure out why.

SewCalGal
www.sewcalgal.blogspot.com

Reply
avatar
March 13, 2013 10:04 PM delete

You also know how to make people rally behind it, obviously from the responses taking time and real effort to make a good article !!indian food

Reply
avatar

Comments are moderated on this blog

Allowed HTML tags: <b>, <i> and <a>

Comment Like This! and Optimize your blog EmoticonEmoticon