Blog Inspirasi Digital

Blog Inspirasi Digital

Tutorial Mikrotik, Hotspot, Blog, SEO, WEB 2.0, HTML, CSS, Javascript dan Inspirasi Digital

Tampilan beda untuk komentar pemilik blog

Membedakan tampilan komentar pemilik dengan pengujung atau istilah kren-nya Author Comment Highlight tentu akan mempermudah pengunjung lain untuk melihat mana komentar dari pengunjung blog dan mana komentar pemilik blog.



Tanpa banyak cuap-cuap langsung aja ya ketahap pembuatannya?


Pertama:


Masuk pada Template -> Edit HTML -> jangan lupa beri tanda centang pada Expand Template Widget


cari kode <dd class=’comment-body’> atau lihat arahan kode warna hijau dibawah ini, jika sudah ketemu kode <dd class=’comment-body’> tambahkan kode dengan warna merah di atas kode tersebut. kemudian tambahkan juga kode </b:if> seperti tampak pada kode dibawah.


<dl id=’comments-block’>
        <b:loop values=’data:post.comments’ var=’comment’>
<b:if cond=’data:comment.author == data:post.author’>
<dt class=’owner-Author’ expr:id=’”comment-” + data:comment.id’>
<a expr:name=’”comment-” + data:comment.id’/>
<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>
<b:else/>
          <dt class=’comment-author’ expr:id=’”comment-” + data:comment.id’>
            <a expr:name=’”comment-” + data:comment.id’/>
            <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>
</b:if>

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

<b:if cond=’data:comment.author == data:post.author’>
<dd class=’owner-Footer’>
<span class=’comment-timestamp’>
<a expr:href=’”#comment-” + data:comment.id’ title=’comment permalink’>
<data:comment.timestamp/>
</a>
<b:include data=’comment’ name=’commentDeleteIcon’/>
</span>
</dd>
<b:else/>

 


Kemudian tambahkan kode CSS dibawah ini


Cari kode dengan warna hijau, jika sudah ketemu tambahkan kode dengan warna merah dibawahnya.


#comments-block .comment-body p {
margin:0 0 .75em;
background:#f3f3f3 no-repeat left bottom;
}


.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;
}


Selamat mencoba..ups hampir lupa ucapan terima kasih buat mas anang yang menulis lebih dulu tutorial ini.

BERI KOMENTAR

Maaf untuk sementara waktu komentar di blog ini di nonaftifkan.

 

Back to Top