Modifikasi Tampilan Pesan Komentar
Memodifikasi tampilan pesan formulir komentar, mungkin bagi anda yag
bosan dengan tampilan pesan komentar yang biasa-biasa saja karena tidak
ada warna background atau yang lainya, jujur saya sendiri agak jenuh
melihat tampilannya biasa saja. Dengan sedikit modifikasi mungkin ini
bisa jadi solusi, kita bisa merubah warna background, warna font, jenis
font dan ukuran font. Memodifikasinya sangat mudah dilakukan karena
hanya sedikit perubahn pada kode HTML dan sedikit penambahan kode CSS.
Tips ini saya dapatkan dari blog prasutan dan saya beri sedikit tambahan agar tampilan menjadi lebih menarik.
Berikut cara memodifikasi Tampilan Pesan Komentar:1. Masuk ke Template pilih Edit HTML lalu Centang Expand template widget
lalu ganti dengan kode <div id='pra-comment'><data:blogCommentMessage/></div> ,
"Biasanya kode <p><data:blogCommentMessage/></p> jumlahnya lebih dari 2 jadi ganti semua kode tersebut"
2. Kemudian letakkan kode berikut ini diatas kode ]]></b:skin>
/*-- modifikasi pesan komentar--*/
#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
}
0 Response to " "
Post a Comment