Mempercantik Pesan Komentar Blogger

Tampilan default pesan komentar mungkin sedikit membosankan, sederhana tanpa sedikitpun dekorasi dari aspek desain. Sekarang bagi Anda yang ingin memiliki pesan komentar yang berbeda, Anda bisa mencoba dengan menambahkan beberapa CSS pada blog Anda untuk merubah background pesan komentar Anda. Sebagai contoh anda bisa melihat gambar diatas. Cara membuatnya cukup mudah, Anda harus mengikuti langkah berikut:

1. Login Blogger.
2. Template, Edit HTML.
3. Tekan Ctrl+F (untuk mempermudah proses pencarian) dan cari code berikut:
    <p><data:blogCommentMessage/></p>
4. Lalu ganti dengan code berikut:
    <div id='pra-comment'><data:blogCommentMessage/></div>

Kemungkinan code <p><data:blogCommentMessage/></p> lebih dari 1, lalu ganti semua code tersebut.

5. Tekan Ctrl+F dan cari code berikut ]]></b:skin>
6. Tambahkan CSS berikut diatas ]]></b:skin>

#pra-comment{
position: relative; 
background:#F3C5C5;
width:100%;
padding:10px; 
font:normal 12px trebuchet ms; 
text-align:justify; 
border:3px solid #AD3000;
margin:0 10px 10px 0; 
margin-top: 10px; 
line-height: 1.3em; 
} 
#pra-comment::after, #pra-comment::before { 
top: 100%; 
border: solid transparent; 
content: " ";
height: 0; 
width: 0; 
position: absolute; 
pointer-events: none 
} 
#pra-comment::before { 
border-top-color: #AD3000; 
border-width: 15px; 
left: 10%; 
margin-left: -36px 
}
#pra-comment::after { 
border-top-color: #F3C5C5; /* Samakan dengan warna background */
border-width: 9px; 
left: 10%; 
margin-left: -30px
}

6. Save template.
7. Belum selesai, sekarang masuk ke Setelan, Pos dan Komentar, lalu isi Pesan Formulir Komentar.

8. Save.

Share This :