Monday, June 13, 2011

Highlight Author Comment in Blogspot

Highlight Author Comment in Blogspot


Highlight Author Comment in Blogspot
This trick is to give a Highlight Author Comment . This will make the blogs owner and authors comments looks different from the visitors comments. It's very useful and interesting blogger hack tips. You can see the example in my blog. Here is what to do to make a "Highlight Author Comment" effect in Blogspot.
  1. Login to blogger, then choose "Design --> Edit HTML". Don't forget to backup your template first.
  2. Check the "Expand Widget Templates" box.
  3. Copy this script and put it before ]]></b:skin> or copy to your CSS area.
    .comment-body-author {
    background: #E6E6E6;<span style="color: red;"> /* Background color*/</span>
    color: #000; <span style="color: red;">/* Text color*/</span>
    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; <span style="color: red;">/* Position*/</span>
    }
  4. Then Find this Code
    <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>
  5. Then Replace the above code with the below code
    <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>
  6. Then Preview and Save your Template.

No comments:

Post a Comment