Friday 7 June 2013

Tutorial : Jadikan Comment Box Kelihatan Cantik

Tutorial nak cantekkan Comment box!jom ikot step acik kat bawah..Sebelum tuh nak bg tau ler, ini bukan totally ilmu acik yer, sekadar nak berkongsi apa yang acik dah buat..Let start Now!



1. go to > Design > Edit Html 

2. cari kod berikut :
]]></b:skin>
3. Copy kod dibawah dan paste diatas kod anda cari tadi:

#comments-block{
margin:0;
padding:0;
}
#comments-block .comment-author{
background:#000000 !important;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 10px;
padding:5px;
font-size:15px;
font-weight:bold;
border:1px solid #000000;
}
#comments-block .comment-body{
margin:0 0 .60em;
padding: 5px 5px 5px 5px;
background: url(BACKGROUND URL);
repeat top left;
-moz-border-radius: 20px 20px / 20px 20px;
border-radius: 5px 5px / 5px 5px;
font-size: 16px;
border-left: 1px dashed #000000;
border-right: 1px dashed #000000;
margin-top: -5px; /*position*/
}
#comments-block .comment-footer{
margin:0;
font-size: 13px;
font-weight: normal;
margin-bottom: 20px;
border-left: 1px dashed #000000;
border-right: 1px dashed #000000;
border-bottom: 1px dashed #000000;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
margin-top: -12px; /*position*/
padding: 5px;
}
#comments-block .deleted-comment{
font-style:italic;
color:gray;
}
#comments-block .comment-author a{
color:#ffffff !important;
}
#comments-block .comment-footer a, .comment-body a{
color:#000000 !important;

BIRU : warna border . refer sini nak cari kod warna
MERAH : saiz font..boleh ubah nak kecik atau besaq
PINK : url background yang anda suka...kalau susah nak cari, tukar jadi transparent jerr..
HIJJAU : boleh tukar kepada solid/ dashed/ dotted

selamat mencuba (",


No comments:

 photo left.png  photo right.png  photo pink_heart.png