Authors and Reader : Different Background

In the blog standart, comment of readers and authors usually the same, so many comments that look less beautiful. If you want author's comment has different background from the readers, here's how:

• Login to blogger account
• Select "Layout --> Edit HTML" menu
• Check little box "Expand Widget Templates"
• You Should back up your template first. Click Download Full Template
• Copy the script below code before ]]></b:skin>

.comment-body-author {
background: #E6E6E6; /* Background Color */
border-top: 1px dotted #223344;border-bottom: 1px dotted #223344;border-left: 1px dotted #223344;border-right: 1px dotted #223344;
margin:0;
padding:0 0 0 20px;
}

Description:
background: #E6E6E6; is background color. Look at Color Code Table if you want to replace.
dotted is line/border. Look at Style Border Code if you want to replace.

• After that, find code as below. Although not exactly the same, try to find a similar code with:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<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>
said...
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<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>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

• Red color Code is the code that you must add the HTML.
• Save Template.

Related Posts