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.

Para completar o conteúdo e você aprender um pouco mais sobre CSS para configurar os seus comentários da forma que quiser visite estes links:
Aprenda HTML e CSS
CSS Padrões
Site do Maujor

Esta dica eu aprendi com o Usuário Compulsivo

6 Comentários:

Raphael Cordeiro disse...

AH consegui :) pode deixar :D

Raphael Cordeiro disse...

Os comentários do autor ficaram duplicados "/
Vê como faz pra me ajudar, segui os passos certinhos.
blog Papo Contemporâneo

Insight disse...

Essa é uma das minhas maiores dificuldades, nunca consegui personalizar o comentário do autor. Tá certo que nunca insisti nisso, mas nas vezes que tentei não consegui. =/
Vou seguir esse tutorial. Muito bem feito! Parece que agora vou coneguir. \o/

Áurea disse...

@Insight Que bom! Quanta honra! Espero que dê certo!

jogonocelular.net disse...

ótimo era isso que estava procurando

aprendatocarem30dias disse...

Super dica essa e como sempre uma explicação clara e de fácil compreensão Aurea.

Postar um comentário

Todos os comentários são lidos e moderados antes da publicação.
Para que seu comentário seja publicado leia as regras abaixo:

» Seu comentário precisa ter relação com o assunto do post;
» Meu tempo é curto e às vezes responder às perguntas demanda tempo e pesquisas então paciência;
» VOLTE PARA ENCONTRAR A RESPOSTA NO COMENTÁRIO DE ORIGEM;
» Se a RESPOSTA de sua Pergunta JÁ ESTIVER POSTADA AQUI, NÃO irei responder. ► Se esforce um pouco mais e PROCURE!
» Se você quiser deixar o link do seu blog no comentário assine como OpenId, não inclua links desnecessários em seu comentário;
» Para deixar o link de seu post relevante ao conteúdo deste blog ou post, coloque este código:
<em><b>Seu nome</b> publicou um post sobre.. <a href="Link do Seu post">Título do Post</a></em>

»SEU COMENTÁRIO É SEMPRE BEM VINDO!

 

HOME | TUTORIAIS | TEMPLATES | FEEDTEMPLATES PARA VOCÊ - Copyright © 2007/2009