Numerando comentários no Blogger

Um jeito relativamente rápido e fácil de numerar os comentários de cada post. Bom para separar cada comentário com estilo. Vá até Layout>...

Um jeito relativamente rápido e fácil de numerar os comentários de cada post. Bom para separar cada comentário com estilo.

Vá até Layout>Editar HTML e depois de devidamente fazer o backup de seu template, marque a caixa de verificação Expandir modelos de widgets.

Procure pela seção de código descrita abaixo e inclua as partes em destaque:

<b:includable id='comments' var='post'> ........ <dl id='comments-block'> <script type='text/javascript'>var CommentsCounter=0;</script> <b:loop values='data:post.comments' var='comment'> <div class='' expr:id='data:comment.id'> <dt class='comment-author' expr:id='"comment-" + data:comment.id'> <a expr:name='"comment-" + data:comment.id'/> <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/> <!-- Você pode manter ou não esta linha. Se ela não aparecer, não tem importância --> <span class='numberingcomments'> <a expr:href='"#comment-" + data:comment.id' title='Comment Link'> <script type='text/javascript'> CommentsCounter=CommentsCounter+1; document.write(CommentsCounter) </script> </a> </span> </dt> <dd class='comment-body'> ....... </dd> </div> </b:loop> </dl>

Tenha uma atenção especial com o fechamento da DIV que deve ser imediatamente antes do fechamento do loop.
Depois basta colocar o código CSS relativo à numeração de comentários logo antes de ]]></b:skin> na área de estilos:

.numberingcomments{
float: right;
display: block;
width: 50px;
margin-right: 5px;
margin-top: -35px; /*posição do contador*/
text-align: right;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 30px;
font-weight: normal;
}

/*Uma vez que os números são na verdade links, necessitamos forçar as propriedades de cor*/

.numberingcomments a:link, .numberingcomments a:visited {color: #445566 !important; text-decoration: none !important;}
.numberingcomments a:hover, .numberingcomments a:active {color: #FF9933 !important; text-decoration: none !important;}

Agora deve funcionar tudo direitinho. It´s all folks!
Traduzido de Numbering comments