Minggu, 11 September 2011

Komentar Berbeda untuk Threaded Comments II

Melanjutkan tutorial sebelumnya yaitu mengenai Threaded Comments II for Blogspot, sobat Koben Nurmayanti Zain langsung melayangkan satu pertanyaan bagaimana membuat komentar si empunya blog berbeda dengan komentar pengunjung! Begitu kira² maksud pertanyaannya :D
Mudah saja kok, tinggal menambahkan sedikit CSS lalu dipanggil dengan HTML pada sesi tag comments... Yang susah itu adalah menempatkannya sob :D Lain saja sedikit unik ID, bisa susah menempatkan harus dimana-mananya. Apalagi kode yang dibuat hasil karya orang lain. Oleh karenanya, mari kita mulai bagaimana cara memodifikasi kotak komentar admin agar berbeda dengan komentar para pengunjung dengan ucapan Bismillaahirrahmanirrahiim :)

Trik berikut hanya berlaku untuk postingan sebelumnya mengenai threaded comments! jadi tidak berlaku secara umum ;))
Cari kode ]]></b:skin> lalu masukan bumbu CSS berikut sebelumnya ya..comment-body-author {
color: #0066FF;
background-color: #FF66FF;
font-style: italic;
font-family: "Times New Roman",Georgia,Serif;
}
Urusan variabel CSS silahkan dikreasikan sendiri. Misal kalau mau pakai background gambar, maka tambahkan variable background-image: url('http://link-your-image.jpg');
Setelah dianggap beres dengan urusan variabel, sobat lakukan Expand Widget Templates dan temukan kode berikut...

                                <div class='cm_info'>
<div class='cm_name'>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>
<data:comment.author/>
</a>
<b:else/>
<b><data:comment.author/></b>
</b:if>
</div>
<div class='cm_date'>
<data:comment.timestamp/>
</div>
<div class='clear'/>
</div>
<p><data:comment.body/> <b:include data='comment' name='commentDeleteIcon'/></p>
</div>
</div>
Gantikan seluruh kode tersebut dengan yang ini...
                                <div class='cm_info'>
<div class='cm_name'>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>
<data:comment.author/>
</a>
<b:else/>
<b><data:comment.author/></b>
</b:if>
</div>
<div class='cm_date'>
<data:comment.timestamp/>
</div>
<div class='clear'/>
<b:if cond='data:comment.author == data: post.author'>
<div class='comment-body-author'><data:comment.body/></div>
<b:else/>
</div>
<p><data:comment.body/> <b:include data='comment' name='commentDeleteIcon'/></p>
</b:if>
</div>
</div>
SAVE.
Lihat kreasi sobat masing-masing. Mudah kan, semudah memintanya =)) pisss =))
Semoga bermanfaat :)

Tidak ada komentar:

Posting Komentar