Home » Blogger Tutorials, Tricks and Hacks » Blogger Comments Tricks » Add Numbers To Your Blogger Comments

Welcome to our AllBlogTools.com v.3 new version, We are still in beta, please contact us to report an error.

|| View All Tutorials ||

Add Numbers To Your Blogger Comments

Add Numbers To Your Blogger Comments

1 Star2 Stars3 Stars4 Stars5 Stars

Report Error

966 views

Reading through all the readers’ comments in the Comments Section of a particular post can be quite confusing sometimes, especially once readers start commenting to another reader’s comments in response to another comment. You follow? You see, that’s how you can lose track: you’re not sure who’s replying to whom anymore.

That’s why in today’s featured tutorial by Rahul Ippar, you’ll learn how add numbers (placed inside bubble/balloon images) to your comments to minimize confusion.

  • Go to the Template section in your Blogger dashboard.
  • Click on the Edit HTML button and then on Proceed.
  • By pressing Ctrl+F, look for ]]></b:skin> in the template’s code.
  • Copy/Paste the code below right above and before it:
.comment-thread ol {
 counter-reset: countcomments;
}

.comment-thread li:before {
 content: counter(countcomments,decimal);
 counter-increment: countcomments;
 float: right;
 font-size: 22px;
 color: #555555;
 padding-left: 10px;
 padding-top: 3px;
 background: url(http://3.bp.blogspot.com/-f6ByQfbwApQ/T4x_8p1FGpI/AAAAAAAAB2A/WJKf-ybmvQk/s1600/comment+bubble2.png) no-repeat;
 margin-top: 7px;
 margin-left: 10px;
 width: 50px;
 /*image-width size*/
 height: 48px;
 /*image-height size*/
}

.comment-thread ol ol {
 counter-reset: contrebasse;
}

.comment-thread li li:before {
 content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
 counter-increment: contrebasse;
 float: right;
 font-size: 18px;
 color: #666666;
}     
  • Save your template and that’s it, you’re done!

Preview your blog and see if everything looks in order. If not, then you might want to make certain adjustments to the positioning of the numbers’ bubble/balloon by editing the values of the attributes highlighted in red above.

 

Liked It ? Please Share

Comments

17 Responses | Post A Comment | Subscribe To Comments RSS Feed

  1. kishore says:

    nice and well explained

  2. Sohil Memon says:

    Hey Bro,
    thanks for this awesome code. I was finding since 2 weeks and today my search ends here! It works 😀

  3. Rahul Ippar:
    Excellent tips, especially for me. Thank you bro, you have nicely presented them :)

  4. Awesome! Thank you for the code. It was really easy to implement.
    Visit my website and leave a comment there to check the numbering http://dailytechnology.blogspot.com/2012/04/google-drive-faq.html

    :)

  5. I tried implementing this on one of my blog but it throws error while saving the template , how can I resolve this pls

  6. now works fine thanks for sharing

  7. phen375 says:

    The deep you dig into the subject and give us the accurate data is appreciable.

  8. but there are many others near, and countless figures who would really like to be there with her!!

  9. The MOI gives important more probability to vary how to the company is managed than the last contract.

  10. alone17 says:

    They have to use it at the previously level of issues so that further issues can be removed. Thanks for talking about information. odd future clothing uk

  11. alone17 says:

    Several organizations continuously emphasize the importance of the great company’s pre-school programs offering an appropriate terminology and connections abilities. Teamspeak servers

  12. jn27 says:

    Because of these organizations, a number of new solutions were presented in the Malaysia which is mostly comprised of client regards solutions and Purchase getting solutions such as travel solutions, tech assistance team, education, client assistance, and financial solutions.Click Here

  13. ArchiVip says:

    Amd doo sy Asegúrese de intentar utilizarlos en lugar de decir todo el nombre, ya que le pondrá en el camino de hablar con más fluidez. Y recuerde utilizar el Verbarrator, software conjugación de verbos españoles, regularmente con el fin de mejorar su fluidez en español. casas prefabricadas

  14. alone17 says:

    You see, that is how you can lose track: you are not sure who is responding to whom any longer. garden lamp posts

  15. vcn says:

    It seemed the techniques of the contemporary level performing professional and the techniques thesiswritingservice1.com
    designed for the politician or attorney to ask for their cause were one and the same.

  16. XZCxzc says:

    The next paying attention to will take position on the 17th Oct in New Delhi. They’re designed by the very best stage developers who will be identified for your polo clothing creating. https://www.facebook.com/Drugstore.comCouponCodes

  17. ASSIUS says:

    When the large of your energy and effort is invested on personal subsistence, short amount of time is left for other activities, like looking after for kids. Getting mature would reduce an individual’s ability to spend a while on the more extensive part of subsistence living (hunting, back-breaking collecting, etc). designlyset

Comments will be closed off on this post 365 days (1 year) after it is published. Apologies to this, but it's all about avoiding a growing comment spam problem. See our most recent posts where you can comment here