Tutorial 29 : Mencantikkan Comment Box

Salam..
I nak tulis tutorial ini semalam tapi berokband dah buat band then tak mahu berkhidmat kat tuan dia so I pun mengalah la kan...kesian!!
U all nak tak komen box cantik macam i punya seperti ini?


Cantik tak? kalau tak cantik sila angguk juga!! kalau tak i tak mahu kasi tutorial lagi! hehehe..gurau je..
Ok.. macam ini caranya..sila ikut step ini ye..kalau tak ikut betul-betul nanti tak boleh jadi tau..

1.Login ke Blogspot, clik design/ layout > Edit HTML > tick Expand Widget Templates
2. Cari code ini...sila gunakan Ctrl F untuk mencari :

]]></b:skin>
3. Dah jumpa? Sila Copy code di bawah  dan Paste DI ATAS code yang u all cari tadi...

#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;
}
 4. Lepas itu sila tukar code yang I merahkan dengan code warna yang u all suka. Nak pilih warna sila ke SINI

UP DATE!!!

Kalau korang nak melengkung bahagian border tu boleh ubah tulisan warna purple:
-moz-border-radius-bottomright: 10px;

10px tu boleh ubah kepada 30px semakin besar nombor semakin melengkung.

5. Nak kelainan ? solid itu boleh ditukar kepada dotted atau dashed
6. Kemudian u all SAVE je la ye..tapi kena betulkan bahagian setting dulu ye..


Pergi ke SETTING > COMMENT > cari COMMENT FORM PLACEMENT > tick EMBEDDED BELOW POST


7. Lepas itu try la tengok hasil nya..menjadi tak? Harap komen lepas buat ye..
Share this PostPin ThisEmail ThisShare on Google PlusShare on Tumblr
98 Comments for "Tutorial 29 : Mencantikkan Comment Box"

thanks for the tuto . .
sngt begune tok sye . .
yg bru mle ber belog . .
(^_^)!!

macam mane sis buat ade sampul surat tu and cm mane nak tuka words comment kepade icon or pic . :) aja pliss .

thank 4 ur tutorial...senang sgt 4 new blogger like me :P

dh try wat..tp jd cmnie...hope ley tlg...=)
http://miszhaznie.blogspot.com/2011/05/mai2-bli-brg-secara-on9.html
pas 2 nak setting pown xreti sgt

TAK DAPAT PUN TUKAR NI..NAPA TAK JADI???

thanks for tutor. good. sgt mbantu, nak share kat blog boleh?

dh jd dh..tq cik farah..hee...:)

Tahniah pada yang jadikk..yang tak jadi tu cuba-cuba lagi yerr

tak jadik....akan try lagi ;O

waa!!!thanxx sesangat wat tuto nie..da jadik....:)

ta jadi pon ... hum :[
knape ea ?

Tak jadi laa kak , dye keluar navbar .

x jadi pun kak

x jadi pn kak

assalammualaikum akak comel... akak, ermm, macam mane nak letak icon dekat sebelah blog archive eh..? maksud saye, dekat setiap title pade blog archieve tu, ade icon2 dia.. macam mane eh..? akak boleh tolong ajarkan tak..? terime kasih akak..

culik tuto nih , hihihi
makaseh ye tuan kemah :)

erm , nak culik kotak ' reply here ' tu buleh x?
sweet la . buleh ye , buleh ye . .
tingin sgt ni . huhuu

salam..
nak tanye , mcm mane nak bagi gambar org yg komen tuu betul2 masuk pada kotak komen ?
kalau kurang faham , akak dijemput untuk jenguk ruangan komen di blog saya..
sekian , TK :)

salam kenal..

nice tuto.. but sy x dpt la komen box camni kat blog sy.. kenapa ek? salah copy code ke?
blh tlg tgk x? tuto lain ok je..

THANKYOUU kak ? :DD menjadi laa , THANKS sgt - sgt ~ :))

erkk..susah bgi saya yang terlalu junior dlam dunia blogger ni. :(

SALAM, cik faraah.. sy try nie.. nape name pengomen jadi double ek.. :)

thanx kak farah . marina dh buat , menjadi . love your blog so much . mohon follow mane-mane tutorial ye ?

tq kak sbb buat tutorial nie ianye bergna untk syer :)

terima kasih kak farah....dah jadi....=D

@♥Miss Farah♥??????????? tak jadilah....
dah ikut semua langkah tu.. hahhahaha.. kosong je.....

@♥Miss Farah♥terima kasih akak ... sebab akak la blog saye jadi cantik ...hehe ..tq sangat2 ...

@♥Miss Farah♥ aqk kiter tak jumpa yg "commet from places" kq tq

tak jadi..bencilah kalau buat sesuatu tak menjadi..

@eFFa aZiZ

kalau xjadi tndanya template awk xssuai la tu

@♥Cik Nurfarah♥, muahaha.. thanx ya.. akhirnya menjadi selepas menjenguk macam-macam blog tutorial.. yahoo.. :)

Kalau design tukar ke Template Macam mana gayah Tuhh ? HAHA !

@♥Miss Farah♥ kenapa ye dah tukar tp still gitu je? ada apa2 masalah ke? tp ley preview cuba xde apa yg berubah?

Heeee ! akak , Before this wat menjadi . . pastu dah bape ary langsung tak jadi . naPE eyh ? ? :-(

found diz on google.
sjibik2 dy copy. hihi

http://srisaidatulazeera.blogspot.com/2011/10/tutorial-mencantikkan-kotak-komen.html

@♥Cik Nurfarah♥ , kak farah.. takpelah Nurin buat tak jadikk..So, Nurin try buat kod sdiri then baru jadi..

hwuaaa.. terharu smpai nk lompat2 sbb tuto awk menjadi.. byk2 tuto yg sy ikut tuto ni pling mnjadi.. thanks ye

akak ... npa x jadi yaa...
xde pa2 pun...

Yeppi..kali nie menjadi..dah 3x kali try...xjadi2x..then mlm nie try lagi alhamdulillah menajdi awk...terima kasih sgt2x...tp xpandai nak hias2 bagai g...

http://wadahberbicara.blogspot.com/2012/05/menang-hadiah-tiap-tiap-hari.html

kak farah...nape saya buat tak jadi ea??geramnyrr..hehe
^-^

nape name kat komen box nie jadi double?

kenape sy buat xjadik..?? sy dah try banyak kali tp still jugak xjadik..
:( plez tolong sy...

kenape sy buat xjadik..?? sy dah try banyak kali tp still jugak xjadik..
:( plez tolong sy...

cik farah, knp sy punye tak boleh paste code yg di copy tu.. paste kt atas kan ??

hi, can i know how to change the background colour?..for example the top border, i want to fill with pink coulour n boacground where the comment showed i want in white...please help me n TQ..=)

kenapa saya punya tak dapat???Sedih saya.:(

tengkiu miss farah :) love you muahmuahh :)

tengkiu miss farah :) love you muahmuahh :)

done..thanks.

http://cintazakirah.blogspot.com/2013/05/allahuakbarombak-ais_14.html

hurmm , bru nk ikut tuto yg cantik nie..tngok mggunakan edit html , trus garu kpale..knapa ye edit html sy dah btukar ? xdek da tmpt nk tick expand widget templete..pelik benar tngok smpai xberani nk sentuh takot hilng apa2..smua blogger cmtu ke or blog sy ade msalah eh ?

@mimi zakaria xla kak,mmg da bertukar, xtau da mcm mane nak buat

korang...semua blog memang dah tak ada tick expand widget template. kalau nak mudahkan , EDIT HTML---->FORMAT TEMPLATE---->CTRL F--->then pastelah code tu. tapi kalau tak keluar juga, kena pandai ubah2 coding dia sikit,kalau lucky,jumpalah coding tu.

Kak Farah,dekat setting comment tak ada tick embedded below post. macam mana nak buat ek??
Btw thanks sebab sudi kongsikan tuto . memang kebaboom la blog kak Farah ni ^_^

as salam dear.. nape click CtrlF xkua pape pun... iskk..

dekat coding tu ada anak anak panah hitam dekat sesetengah no tu.kena klik semua anak panah tu baru boleh ctrl + F balik. nak ctrl+f kena tekan dlu dalam kotak coding tu baru jumpa..btw.nice tuto..banyak ambik tuto kat sini.tp dekat setting takde pun tempat nak tick embedded below post..blog yang cantik

-Assalamualaikum, sila tinggalkan komen anda.
-Kalau suka tekan LIKE.
-Insyaallah komen anda akan dilayan :)

Jangan lupa LIKE! dan SHARE!

Terima kasih :)

Related Posts Plugin for WordPress, Blogger...
Back To Top