Header Ads

Breaking News
recent

How to Change Author/owner comments color style..

Hi readers,  

After writing Adding paypal DONATE button on website .. .

Now I'm going to write how to change autor/owner commetns color style on... :D



Highlight and Customize Comments in Blogger
  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Check "Expand widget templates" Box
  4. Search for this.
]]></b:skin>

     5.   Just above it paste the CSS code below,

.hws-comment-body {
background: #FFFFFF;
color: #8a0808;
border: 1px solid #8a0808;
margin:0;
padding:0 0 0 10px;
width:520px;
}

Make these changes:
  • To Change the background color of author comments change #FFFFFF
  • To change font color change #008000
  • To change border size change 1px, to change border style change to solid, dashed or dotted  and to change the color of the border change #008000
  • To change the width of the comment body change 520px
Tip: Use our color generator for making these changes

   6.    Next search carefully for this code in your template,
Tip: Press Crtl +F and search for one line at a time

      <data:commentPostedByMsg/>
          </dt>

          <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>

     7.     Replace it with the following code,

      <data:commentPostedByMsg/>
          </dt>
<!-- o2trick.blogspot.com author comment script starts here -->
<b:if cond='data:comment.author == data:post.author'>
<dd class='hws-comment-body'>
<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>

      8.    Save your template and you are done!
Visit your blogs and see that the author comments now looks different from the visitor comments..

Hope you like this one....
For more tips, trick and tutorial . Subscribe IT.


Please give me your feedback in comment box...

No comments:

Powered by Blogger.