Como Colocar uma Imagem no Cabeçalho dos Comentários

CLASSIFICAÇÃO DO TUTORIAL
FÁCIL

Quando você vai comentar em algum post de vários blogs já deve ter visto uma imagem como esta
no cabeçalho dos comentários:
Veja:

Para que você coloque uma imagem como esta no cabeçalho dos seus comentários você deve:

Não Se Esqueça:
» Essas configurações demandam algum conhecimento em códigos HTML e CSS. Portanto:
♥ Sempre tente antes num blogue de testes.
♥ Salve o seu template antes de começar, clicando em: Fazer backup/Restaurar
♥ Leia o tutorial até o fim e tenha certeza de ter entendido.

1º Clique em Layout ► Editar HTML ► Clique em Expandir modelos de widgets.

2º Encontre o código abaixo:

Obs: Você não precisa procurar todas as linhas do código, basta usar o Ctrl+F copiar uma linha e procurar, depois compare se o bloco de códigos se assemelha a este.

<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4>
<b:if cond='data:post.numComments == 1'> 1 Comentário:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>

<dl id='comments-block'>

Acrescente a linha em vermelho com o endereço da sua imagem onde está indicado abaixo:

<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4>
<img src='URL da sua Imagem'/>
<b:if cond='data:post.numComments == 1'> 1 Comentário:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>

<dl id='comments-block'>

Complementando...

3º Para que a expressão 5 COMENTÁRIOS fique da forma como está na imagem. Você deve encontrar no CSS do seu blog a linha #comments h4 e editá-la da forma que preferir.

#comments h4{
font-weight:bold; /*Fonte em negrito*/
font-size:125%; /*Tamanho da Fonte*/
line-height:1.4em; /*Altura da Linha*/
text-transform:uppercase; /*Texto todo em caixa alta*/
letter-spacing:.2em; /*Espaço entre as letras*/
color:#2B8FB7; /*Cor da Fonte*/
margin:1em 0;
}

Para que você aprenda mais clique em:

♦ Corrigindo o Link de Comentários
♦ Como Realçar os Comentários do Autor do Blog

Qualquer dúvida sobre a edição do CSS consulte: CSS PARA WEBDESIGN