But, never fear! If you're an IE user who wants to use comment numbering, you can download any of the browsers I mentioned above for free. Firefox is my personal favorite as it has so many useful addons available to do nifty things like block advertisements, and display "Web of Trust" ratings for websites so you'll know if a link you're about to click takes you to a known spam site. It's saved my hide on multiple occasions!
And did I mention they're all free? :)
Hi, my name is Elby --- I'm the friendly admin of this joint! :D
I was watching Snoodles count the comments for the giveaway this morning . . . by hand . . . and she mentioned that she'd like to have comment numbers --- an upgrade with which I could definitely agree!
So, I gave it a quick search and came up with a very detailed (i.e., AWESOME!) tutorial by Susie of 1st Floor Flat the Computery who had nevertheless been having trouble with getting it to work. Looking over her code, I saw some things which I could simplify, and now it's working on LilyPadQuilting with no problems. Yay!
Since the propagation of knowledge is a noble endeavor, I'll tell the interwebz how I did it!
Like Susie, I'll mention first off that you must have your comments "embedded" under the post. To do this, log in to the design interface of your blog, click "Settings", and then "Comments", and make sure that "Embedded below post" is selected.
Click "Save Settings" at the bottom of the page.
Done? Alrighty, then --- let's get down to business! Click on "Design", and then "Edit HTML". Click the box entitled "Expand Widget Templates".
Now, hit "Ctrl" + "F" on your keyboard to bring up the "Find" box at the bottom (or top) of your browser. Type this into the box:
<bodyThis should highlight the beginning of your blog.
Directly BELOW that line, paste this code:
<script type='text/javascript'>var commentCounter = 0;</script>This is just a snippet which creates a number we'll use later.
Now, remove the text that was in the "Find" box at the bottom of your browser, and type this in:
data:commentPostedByMsgThis will highlight the last item in the top part of the comments.
Directly BELOW that line, paste this code:
<span style='display: block; float: right; font: bold 12px serif; color: #AAA;'>This creates a little box, adds one to that number we created before, and sticks it inside. For those of you who want to change the font, that's in the first line there: "font: bold 12px serif". You can find out how to change that by looking over these pages on W3schools: CSS Font, Font Property.
<script type='text/javascript'>
commentCounter ++;
document.write(commentCounter);
</script>
</span>
For those who want to change the color of the number, you can generate a color code at 4096 Color Wheel. Just paste the number it gives you where the "AAA" is right now. Don't delete the # (pound) sign, though! That tells the browser that what follows is a color.
Now, click "Save Template" at the bottom of the screen.
Well, that's all there is to it, actually. Wasn't that EASY??
Just remember that since Blogger only allows 200 comments per page, the counter will start over when you move to the next set of comments. To find the winner of your giveaway, add 200 to the number on the comment for each page you've gone through.
Good luck, and leave a (fabulously numbered) comment if you need help!
