IZZAHASHARI[DOT]BLOGSPOT[DOT]COM

Friday, 10 February 2012

Tutorial : Comment Box Jadi Cantik :)

Assalamualaikum :)
Hello ! Izzah hari ni nak ajar korang macam mana nak buat comment box korang jadi cantik macam Izzah :)
Apee ? tak tau ke macam mana bentuk yang baru punyee ? Huhu ! ok meh Izzah tunjuk :


#Klik kalau tak nampak and tak jelas.


Okey :) nampak tak ? cantik kann ? kan ? Hahahahahaha ! okay , yang izzahashari blablabla ape bende tu biarkan :) sebab tu watemark ! kalau tak de maksodnye bukan Izzah punya :) Haha ! ok,balik ke topic.

Korang nak buat tak ? kalau tak nak Izzah hentikan entry ni :) haha ! okeh , jom mulaa :)


#StepDiBawahNiYe:


1.Log in blog > Dashboard > Design > Edit Html.

2.Tick Expand Widget Templates.

3.tekan Ctrl+F dan search for this code :

]]></b:skin>

4.Dah jumpa ? bagos ! ok copy kod kat bawah ni pulak :)

#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;
 
5.paste kan di bahagian atas kod yang korang cari tadi tu :).

Note pesanan :

warna merah : URL BACKGROUND untuk kotak comment korang :)

warna biru : korang ubah dengan kod warna yang korang sukaa yee :).. kod warna dapat kan di sini >> KLIK SANA !

6.Dah ubah ? hmm cepat yee.

7.Ok dah siap ? Preview duluu :) kalau tak de error boleh la SAVE !

8.Cuba korang tekan entry korang yang ada comment je ! tengok lah kat bahagian comment korang :)
Jadi tak ? Haha ! Komen leww ~


Jadi ? Tak jadi ? Sila Komenn ~


Selamat Mencubaa



Assalamualaikum :)
Bye :)


11.02.2012 

4 comments:

LinkWithin

Related Posts Plugin for WordPress, Blogger...
This blog fully designed by IZZAHASHARI | Dont copy my tutorials or my entries ! | Alright reserved by IzzahAshari