Here are the steps.
Step #1 --Go to Layouts/ Edit HTML, give check sign to Expand Template Widget
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>
<b:if cond=’data:comment.isDeleted’>
<span class=’deleted-comment’>
<data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
</p>
</b:if>
</dd>
Then above it, insert this code
<b:if cond=’data:comment.author == data:post.author’>
<dd class=’owner-Body’>
<p><data:comment.body/></p>
</dd>
<b:else/>
And below </dd> insert this code :
</b:if>
The full code after changing is :
<b:if cond=’data:comment.author == data:post.author’>
<dd class=’owner-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>
<dd class=’owner-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>
Step #2 -- add CSS code
Find this CSS code
#comments-block .comment-body p {
margin:0 0 .75em;
background:#f3f3f3 no-repeat left bottom;
}
Then add this code below it.owner-Body {
margin:0;
padding:0 0 0 20px;
}
.owner-Body p {
font-size:100%;
margin:0 0 .2em 0;
color:#FF0000;
text-decoration:bold;
}
Step #3 -- Save it and preview your blog.
Thanks again o-om for the advice.