Kako numerirati komentare?

Odogovor na pitanje br. 5 u rubrici TKO PITA - NE SKITA! je slijedeći: Možemo numerirati komentare bez problema, eto ja sam jutros napravila isto pomoću ovog tutoriala koji upravo pišem, dakle - funkcionira. Kako je i sama čitateljica u pitanju navela, ovo je posebno zgodno kada radite nagradne igre u kojima morate uz pomoć random.org stranice odabrati dobitni komentar. U mom se slučaju radi o oblačićima ali to možete jednostavno promijeniti, na samom kraju tutoriala pojasnit ću kako. Krenimo!

KORAK #1

Logirajte se na Blogger, otiđite na IZGLED -> Uredi HTML
i kliknite na kućicu "Proširi predložak miniaplikacije"

KORAK #2

Pronađite (pomognite se akcijom CTRL+F) ovaj kod:

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

pa odmah neposredno PRIJE njega, pestajte ovaj kod:

<script type='text/javascript'>var CommentsCounter=0;</script> <!--COMM-NUM-STARTS-->

Sada pronađite ovaj kod:

<data:commentPostedByMsg/>

pa odmah neposredno POSLIJE njega pestajte ovaj kod:

<!--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-->

KORAK #3

Ovo je korak u kojem "dotjerujemo" izgled numeracije komentara. Pronađite ovaj kod:

</head>

pa odmah neposredno PRIJE njega, pestajte ovaj kod:

.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; } <!--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-->

Uređenje obojenih kodova:

KOD PLAVE BOJE- ovaj kod određuje boju brojeva.
KOD CRVENE BOJE - mijenja balončić u bilo koju sliku po vašem izboru koju prethodno morate uploadati na primjerice imageshack.us i na crveno mjesto pestajte novi direct link koji ste tamo dobili.
KOD ZELENE BOJE - ovdje možete podesiti visinu i širinu slikice.


Na koncu sejvajte i to je to! Započnite s brojanjem komentara!!!