Deze code dient voor het toekennen van een verschillende opmaak voor de reacties van de blog auteur(s) en van je bezoekers.


Vink "Widget-sjablonen uitvouwen" aan.
Voeg deze CSS code toe :

/* Comments
----------------------------------------------- */
#comments {
 margin:0;
 background:#CCFFCC;
 }
#comments h4 {
 margin:0 0 10px;
 border-top:1px dotted #99bb99;
 padding-top:.5em;
 line-height: 1.4em;
 font: bold 110% Georgia,Serif;
 color:#333;
 }
#comments-block {
 line-height:1.6em;
 }
.comment-author {
 background:#CCFFCC /*comment header background color (comment author name)*/
url("http://www.blogblog.com/dots/icon_comment.gif") no-repeat 2px .35em;
 margin:.5em 0 0;
 padding:0 0 0 20px;
 font-weight:bold;
 }
.comment-body {
 background:#99FFFF; /*Reader comment background color*/
 margin:0;
 padding:7px 7px 7px 7px; /*Modified padding values*/
 }
.comment-body p {
 margin:0 0 .5em;
 }
.comment-body-author {
 background:#cccccc; /*The author comments background color.*/
 margin:0;
 padding:7px 7px 7px 10px; /*Modified padding values*/
}
.comment-body-author p {
 font-size:105%;
 margin:0 0 .2em 0;
 color:#6728B2; /*The author comments text color.*/
 text-decoration:bold;
}
.comment-footer
{
text-align: right;
}

Ga vervolgens op zoek naar deze code en voeg er de groene stukken aan toe.

<b:includable id='comments' var='post'>
  <div class='comments' id='comments'>
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
      <h4>
        <b:if cond='data:post.numComments == 1'>
          1 <data:commentLabel/>:
        <b:else/>
          <data:post.numComments/> <data:commentLabelPlural/>:
        </b:if>
      </h4>

      <dl id='comments-block'>
        <b:loop values='data:post.comments' var='comment'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <a expr:name='data:comment.anchorName'/>

            <b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if>
            <data:commentPostedByMsg/>
          </dt>

<!-- coloured comments -->
        <b:if cond='data:comment.author == data:post.author'>
          <dd class='comment-body-author'>
            <p><data:comment.body/></p>
          </dd>
        <b:else/>
<!-- coloured comments -->

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

<!-- coloured comments -->
        </b:if>
<!-- coloured comments -->

          <dd class='comment-footer'>

            <span class='comment-timestamp'>
              <a expr:href='data:comment.url' title='comment permalink'>
                <data:comment.timestamp/>
              </a>
              <b:include data='comment' name='commentDeleteIcon'/>

<p><br/></p>

            </span>
          </dd>
        </b:loop>
      </dl>


Geïnspireerd door deze bron.