Como Realçar os Comentários do Autor do Blog


Para que os seus comentários sejam destacados dos demais no seu blog siga este tutorial.

Clique em Layout ► Editar HTML.► Marque a caixinha Expandir modelos de widgets
1º Passo
1- Encontre o código:
          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>
Busque pela linha <dd class='comment-body'> com o Ctrl+F que fica fácil

2- Acrescente o código
<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<p><data:comment.body/></p>
</dd>
<b:else/>
Acima do código:
          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>
E a linha: </b:if> abaixo deste código.

» Ficando assim:
<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<p><data:comment.body/></p>
</dd>
<b:else/>

          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>
</b:if>
♦ Clique em VISUALIZAR para se certificar que está indo tudo certo.

♦ Clique em SALVAR ALTERAÇÕES.
2º Passo
Agora você vai configurar o CSS dos seus comentários no seu blog:

» Cole o código:
.blog-author-comment {
margin:.25em 0 0;
}
.blog-author-comment p {
margin:10px;
padding:10px;
border:1px dotted #c0c0c0; /*Configure o tipo de borda e a cor*/
background:#f5f5f5; /*Cor do fundo do SEU comentário*/
}
» Acima da tag ]]></b:skin>

♦ Clique em SALVAR ALTERAÇÕES.

♦ Clique em Visualizar blog e Clique em um post para verificar se seu comentário está diferenciado dos outros.

» Vá editando o código CSS até ficar da forma que quiser.
Previous
Next Post »