Quando você tem um blog, você sabe como é importante interagir com os leitores do blog e uma das muitas maneiras é através da resposta a seus comentários. Mas quando os seus artigos estão cheios de comentários, é muito importante destacar os comentários do autor do blog ou até mesmo de um moderador de forma que destaque seu comentário dos outros.

O Blogger tem avançado e muitos códigos novos são adicionados. Então, para realçar comentários do autor do Blog, você tem apenas que seguir os seguintes passos:

1º Passo: Vá para o Painel do Blogger -> Design -> Editar HTML -> Expandir Modelos de Widgets.

2º Passo: Antes de prosseguir, recomendo fazer backup do template, feito isso, pressione CTRL+F e procure por:

<b:loop values=’data:post.comments’ var=’comment’>
<dt expr:class=’&quot;comment-author &quot; + data:comment.authorClass’ expr:id=’data:comment.anchorName’>
<b:if cond=’data:comment.favicon’>
<img expr:src=’data:comment.favicon’ height=’16px’ style=’margin-bottom:-2px;’ width=’16px’/>
</b:if>
<a expr:name=’data:comment.anchorName’/>
<b:if cond=’data:blog.enabledCommentProfileImages’>
<data:comment.authorAvatarImage/>
</b:if>
<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/>
</dt>
<dd class=’comment-body’ expr:id=’data:widget.instanceId + data:comment.cmtBodyIdPostfix’>
<b:if cond=’data:comment.isDeleted’>
<span class=’deleted-comment’><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
</p>
</b:if>
</dd>
<dd class=’comment-footer’>
<span class=’comment-timestamp’>
<a expr:href=’data:comment.url’ title=’comment permalink’>
<data:comment.timestamp/>
</a>
<b:include data=’comment’ name=’commentDeleteIcon’/>
</span>
</dd>
</b:loop>

Substitua todo o código, pelo seguinte:

<b:loop values=’data:post.comments’ var=’comment’>
<div expr:class=’&quot;author-comment &quot; + data:comment.authorClass’>
<dt class=’comment-author’ expr:id=’data:comment.anchorName’>
<b:if cond=’data:comment.favicon’>
<img expr:src=’data:comment.favicon’ height=’16px’ style=’margin-bottom:-2px;’ width=’16px’/>
</b:if>
<a expr:name=’data:comment.anchorName’/>
<b:if cond=’data:blog.enabledCommentProfileImages’>
<data:comment.authorAvatarImage/>
</b:if>
<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/>
</dt>
<dd class=’comment-body’ expr:id=’data:widget.instanceId + data:comment.cmtBodyIdPostfix’>
<b:if cond=’data:comment.isDeleted’>
<span class=’deleted-comment’><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
</p>
</b:if>
</dd>
<dd class=’comment-footer’>
<span class=’comment-timestamp’>
<a expr:href=’data:comment.url’ title=’comment permalink’>
<data:comment.timestamp/>
</a>
<b:include data=’comment’ name=’commentDeleteIcon’/>
</span>
</dd>
</div>
</b:loop>

4º Passo: Agora procure por ]]></b:skin> e antes, adicione:

.comment-footer{
margin-bottom:0 !important;
}
.author-comment{
background-color:#F0FFF0;
padding:5px;
margin-bottom:1.5em;
border:1px solid #ccc;
border-radius:10px;
}
.author-comment.blog-author {
background: #FFEBCD url(https://lh3.googleusercontent.com/_-BRP4LFLyWc/TZX3b7r2AyI/AAAAAAAAATY/8Am8ri02OjE/s800/admin.png) no-repeat right top;
}

5º Passo: Visualize, salve o seu template e faça um teste. Se algo deu errado, basta restaurar o template para o Backup que recomendei fazer.

Créditos pela modificação do código: http://www.simplebloggertutorials.com/2011/04/how-to-highlight-author-comments-in.html

[adsense]