Highlight Blogger Author Comment (different from other)

Friday, 9 November 2012

Highlight Blogger Author Comment (different from other)

Whenever you reply as an author to any comment, it will be the part of all comments and no one can identify the author's comment when scrolling the page. It is very necessary for the Author's comment to be displayed uniquely different from all other comments. You can say that Author's comment must be highlighted. So if you want then I am telling you how you can high light your comment as author.

1- Login to you blogger dashboard

2- Click "More Option" against your required blog name (just before "View Blog" option)

3- Select "Template" and Backup/Restore your Template.

4- Choose Customize and then click on Advanced.

5- Add CSS page, scroll down if you see CSS coding and Paste the following code in the last.

.bhd-comment-body {
background: #FFFFFF;
color: #0ba1f1;
border: 1px dotted #0ba1f1;
margin:0;
padding:0 0 0 10px;
width:520px;
}

You can change author comment body background color of your choice instead of #FFFFFF.
#0ba1f1 shows the font color of author comment.
dotted can be replaced with dashed or solid for border style and any color of border instead of #0ba1f1.

6- Click "Apply to Blog" Button and then click "Back to Blogger".
7- Click "Edit HTML" and then Select Proceed and check Expand Widget Templates.
Now Search the Following Coding accordingly (Search this Line by Line without select space).

<data:commentPostedByMsg/>
</dt>

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<data:comment.body/>
<b:else/>
<data:comment.body/>
</b:if>
</dd>

And Replace it with the following.

<data:commentPostedByMsg/>
</dt>
<b:if cond='data:comment.author == data:post.author'>
<dd class='bhd-comment-body'>
<data:comment.body/>
</dd>
<b:else/>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<data:comment.body/>
<b:else/>
<data:comment.body/>
</b:if>
</dd>
</b:if>

OR
If the above searched coding different, then search this.

<b:if cond='data:comment.isDeleted'>
<data:comment.body/>
<b:else/>
<data:comment.body/>
</b:if>

Replace with the following code.

<b:if cond='data:comment.author == data:post.author'>
<dd class='bhd-comment-body'>
<data:comment.body/>
</dd>
<b:else/>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<data:comment.body/>
<b:else/>
<data:comment.body/>
</b:if>
</dd>
</b:if>

Now Save your template and check your comments.