Selamat bertemu kembali sobat. Saya berharap sobat semua selalu dalam keadaan sehat dan happy-happy adjah. Langsung saja ya... pada pertemuan kali ini saya coba kembali berbagi dengan sobat semua dimana kita akan mencoba membuat tampilan berbeda antara komentar admin dan komentar pengunjung yang memberikan komentarnya pada blog yang dikunjunginya.
Mengapa kita membuat komentar tersebut menjadi berbeda? hmm... tentu saja supaya kita mengetahui mana komentar admin dan mana komentar pengunjung, terutama untuk komentar yang jumlahnya banyak. Dengan adanya perbedaan tersebut mempermudah kita untuk melihat apakah ada jawaban/tanggapan dari admin selaku pemilik blog atau tidak. Cara membuatnya sebenarnya sederhana saja kita hanya memanipulasi sedikit kode css dan membuat duplikatnya yang kita beri sentuhan modifikasi sedikit sehingga nantinya terlihat perbedaan antara komentar admin dan komentar pengunjung.
Langkah-langkahnya sebagai berikut:
1. Login ke blogger dengan email dan password sobat
2. Klik rancangan, Edit HTML
3. Cari kode .comment-body atau lengkapnya seperti contoh di bawah ini:
.comment-body {
margin:0 0 1.25em;
padding-top:0;
padding-$endSide:0;
padding-bottom:0;
padding-$startSide:20px;
}
margin:0 0 1.25em;
padding-top:0;
padding-$endSide:0;
padding-bottom:0;
padding-$startSide:20px;
}
4. Copy kode tersebut dan pastekan di bawahnya lalu tambahkan kode -user pada .comment-body { atau seperti ini .comment-body-user {
5. Pada kode kedua .comment-body-user { tambahkan kode css yang akan membedakan komentar admin dengan komentar pengunjung sehingga kodenya menjadi seperti ini.
.comment-body-user {
margin:0 0 1.25em;
padding-top:0;
padding-$endSide:0;
padding-bottom:0;
padding-$startSide:20px;
font-weight:bold;
background:#8B0000;
border-left:#E9967A solid 1px;
border-top:#E9967A solid 2px;
border-bottom:#E9967A solid 2px;
border-right:#E9967A solid 1px;
-moz-border-radius:8px;
}
margin:0 0 1.25em;
padding-top:0;
padding-$endSide:0;
padding-bottom:0;
padding-$startSide:20px;
font-weight:bold;
background:#8B0000;
border-left:#E9967A solid 1px;
border-top:#E9967A solid 2px;
border-bottom:#E9967A solid 2px;
border-right:#E9967A solid 1px;
-moz-border-radius:8px;
}
7. Pasang kode berikut ini diatasnya
<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-user'>
<p><data:comment.body/></p>
</dd>
<b:else/>
<dd class='comment-body-user'>
<p><data:comment.body/></p>
</dd>
<b:else/>
8. Jika sudah silahkan cari lagi kode <dd class='comment-footer'> dan tambahkan kode </b:if> diatas kode tadi.
9. Simpan template dan silahkan lihat hasilnya dengan klik postingan yang memiliki komentar dari pengunjung dan komentar admin. Di situ bisa di lihat perbedaan seperti yang telah kita buat seperti langkah-langkah di atas.
Catatan: kode css berwarna merah adalah kode yang ditambahkan supaya terlihat perbedaan komentar admin dan pengunjung, contohnya seperti bisa anda lihat di blog ini.
Sekian dulu sobat pertemuan kita kali ini, semoga apa yang saya sampaikan berguna dan bermanfaat, salam.
19 komentar:
terimakasih mas triknya......kalau untuk wordpress ada ga mas
@Peluang Bisnis Online Oriflame, terimakasih sudah berkunjung. Kalau untuk wordpress saya masih belum tahu caranya mas berhubung saya yang masih newbie di dunia blogging. Saat ini saya masih fokus belajar blogspot dulu.
saya cari yang wordpress mas.....saya jug bingung. maklum mas saya juga masih belajar
Wonderful post!
thanks you shared. i love this...
Thank's
Terima kasih berbagi ilmunya sobat.
Langsung diprakktekkan dan alhamdulillah berhasil.
nice post..... sangat bermanfaat.....
pasti di coba.....
makasih....
buat sobat yg mampir dan yg sudah memberikan komentar di blog sederhana ini sy ucapkan terima kasih, maaf baru skrg sy bs membalas krn aktivitas sy yg amat padat akhir-akhir ini.
thx utk tips, salam kenal
waktunya mencoba !
wah yang ini kodenya lebih sedikit ya? klo di blog lain panjang2 mas. thanks share ringan nya :)
sedikit saran, klo bisa diperjelas mas peletakan kode /b:if nya..
wahh mantap bang....
tolong ya kunjungi blog saya http://akatsukihackblog.blogspot.com/
Thanks sahabat ilmunya.. tapi masih ada yang saya ingin tanyakan, kalo untuk menandakan pengunjung sendiri dengan merubah tema default blog itu bagaimana? misal untuk admin backgroundnya berwarna coklat, kalo untuk pengunjung ijo, nah kode untuk pengunjung itu letaknya diman ya? terimakasih.
udah dicoba tuh bro dan sukses berat...
thanks yoo
Salam kenal
ada ngga yang khusus buat comment threaded admin?
keren bognya..... saya juga suka naruto gan....
MalvinShare-This is Time for Sharing
Bisnisberjaya
makasi gan, visit back ya
You came up with an innovative post reflecting each and every single point in a very clear and concise manner.
Posting Komentar