Tuesday, November 30, 2010

How to Create Numbered Comments for Your Blog

I recently helped with a blog design for someone who wanted numbered comments. I'd never thought of doing that before and had to do a little research and googling to find out how to.

I found a great site with wonderful instructions on how to install code for the numbered comments. Be aware that it can get pretty tricky but they have great instructions.

I found the instructions at BloggerStop.net. See the instructions HERE.

Some tips I learned along the way and you may find helpful...

1. Make SURE to go to your "Edit HTML" under "Design" and click the "Expand Widgets" box. Copy and paste all of that code into a document in case you mess up and need to revert back.

2. Read CAREFULLY and follow the steps exactly. One false move can mess up the entire code.

3. The code sets the number as automatically white. You'll need to change it to "black" or another color if you don't want a background.

4. If you don't want a background, you can replace this code:

background: url(http://i50.tinypic.com/egx3t3.jpg) no-repeat;
width: 50px;
height: 48px;

With this code:

background: white;

5. You can also create your own design in Photoshop or something. Just make sure it's only 50 x 50 pixels large or so. Just make sure to adjust the "width" and "height" under "background".

6. You may have to adjust the "margin-right" and "margin-top" to get it to a position you like best. Remember negative numbers will move in a different direction as well (IE. 5px or -5px)

7. You'll have to have embedded comments, not the pop-out comments. Under "Settings" then "Comments" select "Embed below post" under the comments placement section.

8. Oh, while I'm at it... this has nothing to do the comments, but most bloggers find it more convenient if you turn OFF word verification. Near the bottom of the same section as you go to in tip number 7. You can still verify comments before they are published if you want.

9. You can change the size by adjusting the pixels under "font-size". Just adjust, save and view, then readjust as you want.

10. And last, but certainly not least as this is the most IMPORTANT THING I discovered... If you're having trouble seeing the comments (particularly if you use Internet Explorer), go to "Settings" then "Comments" then at the bottom, under the section "Show Profile Pictures on Comments?" choose NO. I can't tell you how long I fought with this. I could see the comments in Firefox (which I use) but they could not be seen in Internet Explorer. It might be a good idea regardless to do this so you can ensure your readers see the numbers too.

Well, I hope this helps someone out there who has been wanting to get numbered comments but didn't know where to start!

And be ready for What's Cooking Wednesday tomorrow! I've got something yummy in mind for you guys :)


Casey said...

Hi, I am following you from Friendly Wednesday!I am going to try this tutorial! I hope you have a wonderful day!


Rachel said...

Hi! Thanks for the great tutorial and yummy sounding recipes on here! I am following you from Friendly Wednesday! Have a great day!


Leslie said...

Thank you, Courtney! Yes, I've been wanting numbered comments forever, and this helped a TON. Thanks!

Angela Lee said...

Does this work on past comments or only on comments after you change the HTML?

Post a Comment

Related Posts Plugin for WordPress, Blogger...