Web Tech Guide

www.blogsmonetize.com feed

Highlight Author Comments in BlogSpot/Blogger Comment Section

 

Obviously, the main purpose of this trick is to make your author comments differ from your visitor's comments. You make your comment in one color and your visitor's comments in another color. It will make your blog more interesting and nicer. You can try to check it out on my blog by commenting this post. It is very easy to achieve with CSS rule and if statement. The following instruction will show you how to do it.

  1. Login to your account.
  2. Click on Design.
  3. Click on Edit HTML
  4. Click on "Download Full Template" to backup your template.
  5. Check "Expand Widget Templates"
  6. Search for
  7. <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>
  8. Replace it with the following code
  9. <b:if cond='data:comment.author == data:post.author'>
    <dd class='comment-author-wrapper'>
    <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: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>
  10. Search for
  11. ]]></b:skin>
  12. And add the following code before it
  13. .comment-author-wrapper{background:#000099; border:1px solid #000099; padding:0.5em; margin-bottom:5px}
  14. Save your template, and you are done.

The CSS code may be tricky for you. You may have to modify that code to make it work with your template. Remember to change the color in the red color above. If you are not able to do it, let me know. I'll try to help you out.

To support multi-author blogs, please follow instruction in Highlight Multi-author in Blogger/BlogSpot Comment Section post instead of this one.

If you see my post interesting, please comment. I will post more trick for Blogger/BlogSpot:-).


© 11/06/2010 11:22:00 PM www.blogsmonetize.com
Loading related posts...

4 comments:

Shiro said...

This is author comment test :-)

Anonymous said...

visitor comment will look like this

Shiro said...

Glad you like it :)

Absolutemortgageco said...

Great info, thanks for bringing these tools to the forefront. I'm grateful for the article.Thanks Again. Will read on...

Alabama Mortgage Company

Post a Comment