Comentários numerados no blog
Autor: Fernando Ambrosio | Publicado: 2011-11-20T00:00:00-02:00

Colocar um contador nos comentário do blogger não é tão difícil como parece, vamos ver em poucos passo como fazer este efeito em seu blog.

Primeiro faça o DOWNLOAD do seu template, entre em DESIGN/Editar HTML clique em BAIXAR MODELO COMPLETO, assim você evita transtorno caso não funcione.

1º Passo: Depois de fazer o DOWNLOAD do seu template clique em EXPANDIR WIDGET e procura pela tag abaixo:


&lt;dl expr:class='data:post.avatarIndentClass' id='comments-block'&gt;
Caso não encontre essa tag procure pela tag seguinte:


&nbsp;&lt;dl id='comments-block'&gt;
2º Depois de localizada adicione os códigos que estão em vermelho na ordem exata como descrito no código abaixo:

&lt;dl expr:class='data:post.avatarIndentClass' id='comments-block'&gt;

&lt;script type='text/javascript'&gt;var contadorComentarios=0;&lt;/script&gt;

&lt;b:loop values='data:post.comments' var='comment'&gt;

&lt;div class='' expr:id='data:comment.id'&gt;

&lt;dt expr:class='&amp;quot;comment-author &amp;quot; + data:comment.authorClass' expr:id='data:comment.anchorName'&gt;
     &lt;b:if cond='data:comment.favicon'&gt;
       &lt;img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/&gt;
     &lt;/b:if&gt;
     &lt;a expr:name='data:comment.anchorName'/&gt;
     &lt;b:if cond='data:blog.enabledCommentProfileImages'&gt;
       &lt;data:comment.authorAvatarImage/&gt;
     &lt;/b:if&gt;
     &lt;b:if cond='data:comment.authorUrl'&gt;
       &lt;a expr:href='data:comment.authorUrl' rel='nofollow'&gt;&lt;data:comment.author/&gt;&lt;/a&gt;
     &lt;b:else/&gt;
       &lt;data:comment.author/&gt;
     &lt;/b:if&gt;
     &lt;data:commentPostedByMsg/&gt;



&lt;span class='comentacontador'&gt;
      &lt;a expr:href='"#comment-" + data:comment.id' title='Link para este comentário'&gt;
         &lt;script type='text/javascript'&gt;
            contadorComentarios=contadorComentarios+1;
            document.write(contadorComentarios)
         &lt;/script&gt;
      &lt;/a&gt;
   &lt;/span&gt;

&lt;/dt&gt;
     &lt;dd expr:class='&amp;quot;comment-body &amp;quot; + data:comment.commentAuthorClass' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'&gt;
       &lt;b:if cond='data:comment.isDeleted'&gt;
         &lt;span class='deleted-comment'&gt;&lt;data:comment.body/&gt;&lt;/span&gt;
       &lt;b:else/&gt;
         &lt;p&gt;
           &lt;data:comment.body/&gt;
           &lt;span class='interaction-iframe-guide'/&gt;
         &lt;/p&gt;
       &lt;/b:if&gt;
     &lt;/dd&gt;
     &lt;dd class='comment-footer'&gt;
       &lt;span class='comment-timestamp'&gt;
         &lt;a expr:href='data:comment.url' title='comment permalink'&gt;
           &lt;data:comment.timestamp/&gt;
         &lt;/a&gt;
         &lt;b:include data='comment' name='commentDeleteIcon'/&gt;
       &lt;/span&gt;
     &lt;/dd&gt;


&lt;/div&gt;

&lt;/b:loop&gt;
  &lt;/dl&gt;
3º Agora copie o código abaixo e coloque antes da seguinte tag ]]&gt;&lt;/b:skin&gt;


.comentacontador {
float: right;  /* alinhamento á direita */
display: block;
width: 50px;   
margin-top: -30px;  /* distância dos números ao topo */
text-align: right;   /* texto alinhado á direita */
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 36px;  /* tamanho da fonte */
font-weight: normal;
}
4º Salve e confira o seu blog.

Créditos à Clau do Mundo Blogger.