Monday, March 14, 2011

Highlight Author Comment in Blogspot

highlight the author comments in blogger

Be Alert : Before doing anything keep remember to take full backup of your template.

Login to your Dashboard > Layout > Edit Html.

Click Expand Widget Templates Check Box.

Copy and paste the code below before the closing ]]></b:skin>

.comment-body-author {
background: #ffffff;
border: 2px solid #666666;
padding: 5px;
}

Change the line
background: #ffffff;
with
background: url(http://DIRECT_LINK_OF_THE_IMAGE.jpg) ;

If you want to show any background image in place of white color.

Next, search for the following lines of code.

<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>
<data:commentPostedByMsg/>
</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>

You have to add Red codes in your html in the way i have shown above between the codes.I hope you will be able to do it.



0 Comments:

Post a Comment