Menandai Komentar Admin dengan CSS

Penting menandai komentar admin blogger agar pengunjung dapat membedakan mana komentar admin dan mana yang bukan. Mungkin Anda pernah melihat ada yang menggunakan penanda dalam bentuk gambar di sudut bertuliskan "Admin", dan ada sebagian yang lain menggunakan jQuery.

Kali ini kita hanya akan menggunakan sebuah elemen dengan background sederhana yang diatur melalui CSS. Loadingnya tentu lebih ringan jika dibandingkan menggunakan gambar. Selain itu tentu cara ini sangat mudah, pemula pun dapat melakukannya.

Bagaimana cara menandai atau membedakan komentar Admin? Ikuti langkah-langkah berikut.

Temukan baris kode berikut.

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

Letakkan elemen berikut setelah baris kode di atas.

<span class='comment_author_flag'>Admin</span>

Kemudian letakkan CSS berikut diatas ]]></b:skin> atau </style>

.comment_admin .comment_author_flag {
display:inline;
background:#CACACA; /*warna latar elemen*/
font-size:13px;
font-weight:normal;
padding:2px 6px;
margin-left:7px;
color:#000; /*warna tulisan*/
border-radius:5px;
text-transform:uppercase;
letter-spacing:.1em /*jarak huruf satu dengan huruf di sebelahnya*/
}

Aturlah properti background dan color agar sesuai dengan gaya template Anda.

Selamat belajar.