Macam mana nak cantikkan comment box? Cuba tengok comment box korang. Nampak hambar je kan? Warna putih je kan? So sekarang kita tukar ianya jadi berwarna sikit =) . Cara-caranya seperti di bawah :
Step 1:
Log in masuk akaun korang. Masing-masing punyer blog o.k. Jangan suka-suki je log in akaun orang lain ;p
Step 2:
Click 'Dashboard" ---> "Layout" ---> "Edit HTML"
Step 3:
Click pada "Expand Widget Templates
Step 4 :
Cari code warna pink kat bawah ni . Cari betul-betul tau! Kalau salah nanti tak jadi. Tapi kalau nak senang tekan "Ctrl F" o.k =)
Step 5 :
Pastekan code kat bawah ni atas code yang korang cari kat step 4 tadi o.k.
#comments-block{
margin:0;
padding:0;
}
#comments-block .comment-author{background:#ff6699 !important;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
padding:5px;
font-size:15px;
font-weight:bold;
border:1px solid #ff6699;
}
#comments-block .comment-body{
margin: 0;
font-size: 17px;
border-left: 1px solid #ff6699;
border-right: 1px solid #ff6699;margin-top: -5px; /*position*/
padding: 5px;
}
#comments-block .comment-footer{
margin:0;
font-size: 13px;
font-weight: normal;
margin-bottom: 20px;
border-left: 1px solid #ff6699;
border-right: 1px solid #ff6699;
border-bottom: 1px solid #ff6699;
-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:#ff6699 !important;
}
margin:0;
padding:0;
}
#comments-block .comment-author{background:#ff6699 !important;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
padding:5px;
font-size:15px;
font-weight:bold;
border:1px solid #ff6699;
}
#comments-block .comment-body{
margin: 0;
font-size: 17px;
border-left: 1px solid #ff6699;
border-right: 1px solid #ff6699;margin-top: -5px; /*position*/
padding: 5px;
}
#comments-block .comment-footer{
margin:0;
font-size: 13px;
font-weight: normal;
margin-bottom: 20px;
border-left: 1px solid #ff6699;
border-right: 1px solid #ff6699;
border-bottom: 1px solid #ff6699;
-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:#ff6699 !important;
}
Step 6 :
Dah habis, sila click "save" o.k ^_^
See! My box got new color.From white turn to pink. Lately ni, jiwa terasa keperempuanan plak. Baru nak sedar kot diri ni perempuan.Hihi! =)
Btw, warna box tu kalau nak tukar boleh ikut warna kesukaan korang. Caranya macam ini :
cari code kat bawah ni :
border-left: 1px solid #ff6699;
border-right: 1px solid #ff6699;
border-bottom: 1px solid #ff6699;
border-right: 1px solid #ff6699;
border-bottom: 1px solid #ff6699;
Then korang nampak tak code warna "ff6699" . O.k nampak kan. Korang boleh tukar pada code yang lain ikut pilihan korang. Nak tahu code warna boleh check kat sini CODE WARNA HTML
p/s: this tutorial is credit to liyana. i just found it yesterday =) thanks!
heheh nais one k.shila...
ReplyDeletethanks for sharing
wc! sharing is caring =)
ReplyDeletetq2.. boleh guna ni.. tq ekh! :)
ReplyDeleteemmm..nak try lahh.tq for sharing..hehe
ReplyDeletetq
ReplyDelete