blog saya tak de divider sebab saya letak 1 post je per page... macam blog mama Gee ni dia letak banyak post... jadi untuk nampak cantik dan kemas... kalau pakai divider memang sesuai...ok... tutorial ni special untuk sis... dan jika ada sesiapa nak buat pun boleh... just follow this step...
1. Login ke Blogspot
2 . Klik Layout > Edit HTML
Klik Download Full Template (Untuk Back-up template) ini penting!
3. Cari kod seperti dibawah ataupun lebih kurang seperti dibawah... yang penting perkataan .post { [sebab kekadang ada template yang bahagian ni panjang sangat kodnya... dan ada juga yang hanya letak margin sahaja...jadi tengok betul2 ya...=)]
.post {
margin: 0 0 1.5em;
padding-bottom: 1.5em;
border: 2px solid #FFC0CB;
padding:7px;
-moz-border-radius: 10px;
}
margin: 0 0 1.5em;
padding-bottom: 1.5em;
border: 2px solid #FFC0CB;
padding:7px;
-moz-border-radius: 10px;
}
4. Kemudian, anda gantikan dengan kod dibawah ini...
.post {
background: url(url divider anda);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
background: url(url divider anda);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
*bahagian yang saya hightlightkan dengan warna merah anda harus meletakkan kod divider anda... divider anda boleh reka sendiri ataupun.... boleh didapati disini... boleh pilih sampai lebam =p . Sila pastikan cara anda mengambil url untuk gambar adalah betul. rujuk disini ya untuk cara mengambil kod...
**[updated] Jika anda tidak jumpa kod .post didalam template anda... boleh tambah kod diatas ini sebelum atau diatas kod ]]></b:skin
5. Anda boleh Preview... dan jika tiada sebarang error dan divider anda pun dah cun! bolehla save dengan jayanya....
Whitey Note: Selamat Mencuba dan jangan lupa tinggalkan komen anda selepas mengambil tutorial ini...=)
waaaaaaaaahh macih byk2 ya mommy... :)
ReplyDeleteakk,nk wt background pink pada tittle post cne ek?
ReplyDeletei like this tutorial.. puash cuba akhrnya berjaya...thanks..!!
ReplyDeleteda dpt wat..thankz..^_*
ReplyDeleteok. dh dapt buat. tQ.. hehe
ReplyDeletesalam...dh jenuh wat tp nape x jd.?? hmmm....
ReplyDelete@nanie
ReplyDeletetak semestinya kena cari kod semua tu... kalo jumpa yang .post tu pun dah boleh ganti...sebab setiap template tak sama dia punya kod... jadi kena perhati betul2...
ok tp kalau saya punya mmg dh sedia ade divider post tu.,cmne.? saya dh jmpe coding divider post yg lame tp bila replace x jd la....
ReplyDelete@nanie
ReplyDeletelebih senang cuba replace kod yang sedia ada tu dengan kod yang diatas ni... ataupun cuba cek samada takut tersilap amik kod ke... banyak kemungkinan...
.post {background:url=http://www.glitter-graphics.com][img]http://dl5.glitter-graphics.net/pub/153/153625nqc2f58k5n.gif[/img][/url];background-repeat: no-repeat;background-position: bottom left;margin:.5em 0 2em;border-bottom:0px dotted $bordercolor;padding-bottom:6em;
ReplyDelete}
hehee...maaf ye menyusahkn.x puas ati sbb xjd.neway coding kt ats tu yg saya punye.ade yg silap ke.? divider post amik kt glitter
.post {background:url=http://www.glitter-graphics.com][img]http://dl5.glitter-graphics.net/pub/153/153625nqc2f58k5n.gif[/img][/url];background-repeat: no-repeat;
ReplyDeletebackground-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
sori td tu x paste abis...
@nanie
ReplyDeleteyup salah... ini pembetulannya...
nanie said...
.post {background: url(http://dl5.glitter-graphics.net/pub/153/153625nqc2f58k5n.gif);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
cara saudari paste kod tu yang salah. codingnya dah betul cuma url untuk gambar tu salah ambil kat glitter graphic tu tak semua kod boleh ambil...sila tengok tutorial saya ya macam mana cara nak ambil url kat glitter graphic... tq...
wee...dh jd.mekacih byk.x abis bace tutorial rupenye.kikiki...akan cube copy paste divider len plak ikut tutorial cmne nk amik coding kt glitter tu.
ReplyDeletesalam mommy.. utk tutorial ni nk tnye, nape wt x dpt2 ek.. blh x tlg tgk2kn ada yg silap ker ngn coding kt bwh ni..
ReplyDelete.post {
background: url (http://dl.glitter-graphics.net/pub/701/701401ue14lmg849.gif);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
knp saye tak jumpe perkataan .post ?
ReplyDeletesaye just jumpe .post footer and blockquote jee .. cmanee yee ?
@Cik Eniey
ReplyDeleteeh... rasa semalam dah reply comment ni... hm...
cuba perhati betul2... bahagian url dan tanda ( tak rapat...
bahagian tu kena rapatkan ya...
@♥ syinot ♥
ReplyDeletekalau tak de boleh masukkan je...
thanx mommy.. done! (^_^)
ReplyDeletemommy, sy da try buat tp tak jadi la.. sy tak jpe pon perkataan .post tu... knpe..?
ReplyDelete@eera
ReplyDeletesaya dah update...tak semua kod ada dalam template... jadi kena belajar modified sikit kita punya html dalam template kita...:)
.post {
ReplyDelete{background: url[url=http://www.glitter-graphics.com][img]http://dl6.glitter-graphics.net/pub/439/439056rvbdehj1y0.gif[/img][/url]);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
apa yg slh yer?xdpt la.....hhuhuhuhuhu
@iDa
ReplyDeletesis... as blogger kena alert.. baca komen2 kat atas.. n baca betul2 tutorial...saya ada provide cara nak amik url kat glitter graphic cemana... tq
sye dah guna
ReplyDeleteterima kasih :)
thanx again for the easy tutorial!!!
ReplyDeletedah try pn and dah dpt..tq..
ReplyDeleteada tutorial utk blockquote tak?
hehe..thanks..dah menjadi.
ReplyDeleteterima kasih mommy c;
ReplyDeletemaceh2 mommy..
ReplyDeletedah menjadi! :)
mekaseh mommy..
ReplyDeletesaye da try..
suke2..~__^
berjaya...tq..=)
ReplyDeletetq mommy .akhirnya jd jgk. huhu.
ReplyDeletethanx...dh apply kat blog ^.^
ReplyDeleten3 baru : Kempen Say No VALENTINE!! ^,^
kenape tak jadi ? sye dah ambik dah url die seperti yg mommy suruh
ReplyDelete.post } .. sye tak jumpe code tu :'(
ReplyDeleteSis , kalau macam nak buat divider yg jenis garis lurus camne ea ?
ReplyDelete:))
salam,mommy,.jadi,thanks tapi kn divider tu btol2 ade kat atas ayat pertame entri sy,.cmne?,.aduhh,die xberada di tmpt yg sptotnyer la,.huhu,.ke sbb mse copy url tu sy xsertakan skali width height n border die?,.plizz,.
ReplyDeletemommy,fyi,.sy gne minima template.,xboley ek?,.
ReplyDeletesy da berjaye da kak! excited! hehe
ReplyDeletecode tu x jumpa..jumpa kod ni je
ReplyDelete.post a:hover img {
width:500px; height:400px; float:middle;
}
salam akak...
ReplyDeletenak tnye..nape bwh divider blog syieda ade warne glap tuu? akak leh x tlg ajarkan cmne nak ilgkan.. :( need ur help..
salam akak...syieda dah tau nape..td syieda on9 dkt opis..opis blocked fb..jdi button like fb tuu yg gelap..hikhik
ReplyDeleteterase diri nieh dpermain oleh fb!!uwaaaa...
thanks , sgt memuaskan :)
ReplyDeletesalam , ehh i da download full template tp pastu kene wat apew ??
ReplyDeletekusut -_-"
Thank U so much mommy!!!~^^
ReplyDeletekenapa post sy jauh antara satu post ke post lg satu walaupun sy dh letakkan divider...
ReplyDeletekenape tak bole? penad lhaa buad
ReplyDelete@azlin othman
ReplyDeletesis kena pergi ke bahagian design lepas tu cari kat bahagian edit post
un tick kan share.
salam mommy . mommy de buat x tuto mcm kalau setiap post kn bila abis je tulis kat bawah tuh mesty ade whitey mommy ..
ReplyDeleteThanks Mommy!
ReplyDeletesalam.. mommy.. kita x paham.. :(
ReplyDelete-mimie-
Time kasih Mommy!!! Banyak kali cube try n error. Akhirnya berjaya lepas beberapa kali baca tutorial mommy. Lepas ni leh la tukar2 divider.
ReplyDelete