Hai Sob... sebelum aku pamit, terlebih dulu aku pengin memposting sesuatu yg mungkin aja bisa kalian manfaatin buat mempercantik tampilan blog masing-masing.
Dan kali ini, aku mau menuturkan tentang cara merubah footer yg tadinya cuma 1 kolom, menjadi 3 atau 4 kolom.
Perlu kalian tau, postingan ini terinspirasi ketika aku jalan-jalan ke rumah Sahabat kita Buwel yg kalo aku amati, tampilan footernya kurang sedap di pandang mata. Kesannya seperti kurang tertata gitu. Nah maka dari itu, berikut aku tuturkan cara mudah merubah tampilan footer menjadi multi kolom, sehingga semua widget yg ada di dalamnya akan nampak tertata rapi.
Baik. Kalo gitu langsung aja. Pertama-tama, login dulu ke account blogger kamu. Lalu dari dasboard, masuk ke halaman layout/tata letak, lepas dulu semua widget yg ada di footer, simpan di notepad, atau titipkan sementara di sidebar dengan cara, ceklik widget yg dimaksud-tahan-geser dan lepas di sidebar. Simpan perubahan.
Kalo udah, sekarang masuk ke halaman edit HTML, centang dulu Expand Widget Template dan jangan lupa back up semua template, bisa dengan mendownload Full Template, atau mengcopynya ke dalam notepad.
Setelah itu, kalian copy CSS Style dibawah ini dan letakkan di ATAS kode </b:skin>
#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}
Sudah?? Sekarang kamu cari script dibawah ini, letaknya jauh dibagian paling bawah barisan kode HTML kamu.
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
Kalau udah ketemu, hapus aja kode script yg berwarna merah diatas, sisakan yg <div id='footer-wrapper'> dan script penutupnya </div>, kemudian sisipkan script HTML dibawah ini, sehingga hasil akhir setelah semua digabungin akan nampak seperti ini,
<div id='footer-wrapper'><div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col1'
preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col2'
preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col3'
preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding:
10px; text-transform: normal 100%;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text3' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>
</div>
Oke sekarang simpan template dan liat hasilnya dengan menceklik page element. Kalo pekerjaan kamu tadi gak ada kesalahan, maka sekarang pada bagian footer akan nampak 4 element baru yg siap kamu pasangin widget yg kamu inginkan. Ambil kembali, widget yg dititipkan di sidebar tadi, dan letakkan lagi di dalam footer. Atur sedemikian rupa sesuai keinginan kamu. Kalo sudah, simpan perubahan dan liat hasilnya.
Nah... udah rapi kan footer kamu sekarang??
Ya sudah kalo gitu, sekarang tiba saatnya aku mohon pamit, undur diri sejenak, menyelesaikan sebuah ritual, yg sebenernya bukan aku yg mau. Tapi demi rasa sayangku buat kalian semua, buat Romo, buat Ibu, buat Diajeng, buat calon Anjeli Kecilku, buat kalian semua sahabat mayaku, Ella, Fanny, Wina, Ninit, Buwel dan semua sahabat yg gak mungkin aku sebutin satu persatu, aku harus tetap optimis bahwa aku pasti akan sembuh dan sehat kembali seperti sedia kala.
Ayo Rio, semangat..!!
Ingat..!! "Untuk menjadi optimis memang bukan jalan yang mudah, mengingat kondisi tiap orang berbeda. Tapi yang penting optimisme harus tetap ada, walaupun jurang itu di depan kita, tinggal kita mau atau tidak untuk menyeberanginya."
53 comments:
waaaaaaaaahhh makasih neh mas mut tutor nya, buwel coba yak....dan semoga hajat2 nya selalu terkabulkan...amiiin
Mo kemana Mut...??? Btw PRof selalu coba tutorial dari semut, meski sering gagal karena keterbatasan PRof dalam menyesuaikan TuTor semut dengan design template IjoPunkJUTee....Tapi tak ada salahnya nyoba kan..??? sekaligus belajar....
Ups hampir lupa, Award dah dipasang, makasih ya....
Yang kode ke 2 nya nggak di temuikan mas mut...xixiixiix...maaf neh....apa buwel emang yang nggak bisa yak.....memang buwel nggak hobby utak atik templet mas mut....ntar tak coba lagi wes mas mut....makasih tutor nya sekali lagi...siiip
pernah coba sih tapi nggak OK malah KO. Yang jadi masalah, bikin pusing nih banyak keluhan kenapa ada yang ketika klik komen di blog kok ada pop up.
sudah diganti-ganti tema masih juga sama.
award dari yu dah ditampilin kemarin, TERIMA KASIH. Bro!
Oya ada yang ketinggalan, foto2 JFC sedang nongol di sana.....
Weih cukup dulu nyepamnya,.....!
Mumpung sempat
Semangat cak, 75% kesembuhan berasal ari dalam diri kita, selain itu thanks banget nih tutornya, tar aku coba pas ada waktu senggang...
aku uda nyoba ini bang, dan berhasil. hiiii
nyoba ah...
lumayan nih, buat hias2...hehehe
perlu di coba juga nih
hehehehehee
mas mut, buwel udah berhasil.....tapi kok pertamanya di mozilla agak ngehang yak setelah di tambahin script itu......trus lagi dasar buwel itu nggak bisa nata widget mas mut....tetep berantakan....kakakakakakaka
Perlu dicoba ah ntar... tutorial yg dicari nih, award dah dipajang tuh..makasih ya!
Jadi pengen direview juga nih rumahku oleh semut, kale aja dapat saran yg bagus, thanks banget loh..
iia harus tetep optimis,hehehhe,semoga semua tercapai,jagan lama lama yah mas semut,aku kan baru kenalan,hikz.....
tutorialna keren,kanpan yah aku mo nyoba :D
gunanya untuk menampilkan kayak yang dibawah ini ya mut??
assalamualaikum,
mut..jangan lama-lama ya,cpt kembali.
info menarik mut..boleh dicoba
wassalam
semoga para cowok lebih rapi menata rumahnya =))
Makasih mas mut infonya.....heheheheh...maaaabbbb ngganggu....
kalo jalan-jalan ke tempatku terinspirasinya mesti bagemana menciptakan bunyi-bunyian kentut yg alus alun mendayu-dayu huehehehe:p
Semangat mut! Btw ritual apa yah??
Selamat pagi Mas Rio,... makasih banyak atas sarannya. Insya Allah akan saya perbaiki semuanya semoga dengan bantuan Mas, blog saya akan jauh lebih baik.
Sekali lagi terima kasih. Akan saya baca tutorialnya dulu.
Insya Allah saya senang sekali kalau ada waktu bisa Chating dengan Mas...
baru juga mau kenalan, kok udah pamit sih, Mut???...
oya, makasih udah di follow, trus kalo aku mo follow balik kok gak ada folowernya ya disini...hehehe
yo wis, ga papa..aku akan 'mengikuti' mu terus deh..
:)
@tisti rabani : di sidebar itu kan ada Neng, dua versi malah, masak gak ada sih, mau follow pake ponsel juga ada tuh linknya
@seti@wan dirgant@ra : wuaduh Bang Iwan, aku bukan apa-apa jangan terlalu menyanjung aku seperti itu. makasih bngt kalo Bang Iwan sudi chating sama aku
@ivan : hehe... ntar aku posting lg Van buat penjelasannya
@wendy : hahaha.. Wendy ni paling bisa bikin aku ketawa
@buwel : selamat ya Wel, blog km skrg udah oke banget
@cebong : amin Yank, xixixi... kangen aku sama kamu
@neng rara : trimakasih Neng, Insya Alloh gak kan lama
@henny : yup betul bngt Hen, kayak punyaku yg dibawah ini lho
@inuel : makasih Cantiq, Insya Alloh aku segera kembali
@patah hati : oke, ntar biar aku terawang blog km
@yudiw : makasi Yud uda pajang awardku
@yanuar : harus nyobain Yan
@kakve santi : yup, semoga bermanfaat
@mocca_chi : alhamdulillah, selamat ya Chi
@tukang komen : makasih Kang atas supportnya
@rco : hahaha... thank's Co atas spamnya, aku suka tuh ama model2 JfCnya, cantiq cantiq semua. Makasih jg uda pajang awardku
@prof : memang template kamu ribet bngt Prof, bikin Semut pusing, hahaha...
@buwel : karna kamu jadi yg pertama, ni aku kasih hadiah Semut Cantiq hahaha...
Makasih tutorialnya, kapan kapan dicoba *kalo ga malas* ;))
Salam kenal balik, makasih ya udah mampir. Sebenarnya sudah sering dengar nama "Rio si Semut" cuma blom berani mampir di pesanggrahan ini. Takut digigit :)) *Just Kidding*
Yang gini-gini aku menyerah......
lho...lho..mau kemana nih? hiatus mulu nih..sedih dong kita2 nih..hiks...emut...emut..we will miss u...katanya mo tampil di acara take me out. oh....jangan2 dia hiatus krn mo tampil di acara itu ya? he he he..yasuds...titidj ya..salam buat diajeng dan calon baby kalian ya....
yaaahhhhhhh...mas rio mo kemana??
dont leave me donk
mampir siang menjelang sore bang semut... ^^
Eh, aku jadi lupa nih mau komen apa...
Fauzan NR [ fhom.blogspot.com ]
aku dateng agih,mau ngeplud keheheheh,,makasih yah komentnya :D
Bingunngggg
Fauzan NR [ fhom.blogspot.com ]
Nahhh.... aku ingat!
FAuzan NR [ fhom.blogspot.com ]
Footernya kayak punya mas semut ya????
Fauzan NR [ fhom.blogspot.com ]
Bagus nih...
Fauzan NR [ fhom.blogspot.com ]
Meski footerku sudah 3 biji tapi artikel ini tetap bermanfaat buat ngedit footernya!
SIIIIp!
Fauzan NR [ fhom.blogspot.com ]
Saya tunggu kunjungan balik anda....
Fauzan NR [ fhom.blogspot.com ]
Saya tinggal dulu ya....
Fauzan NR [ fhom.blogspot.com ]
mas rio mah emg paling jago yang beginian,, sip deh mas buat infonya :)
semangat yah mas!! moga cepat sembuh deh kalo gituh..
Maaaabbb nggannggu neh...sukses selalu mas mut...maaabbb lagi baru mampir....
mampir lagi yo cak...
Punya'Q udah 3 coloum, xixixixiixix.....
Jadi ya, liat2 aja nih :D
thank buat infonya mas semut insya Alloh aq cobain dh,
met siang mas mut...ngucapin sekali lagi.. :)
sipp..makasih infonya..
salam kenal
SALAM CINTA DAMAI DAN KASIH SAYANG ‘TUK SAHABATKU TERSAYANG
I LOVE YOU PHUUUUUUUULLLLLLLLLLLLLLLL
wis kenalan sik kono nek ngunu, podo aku yo ra kenal koq =))
mbuh karep'e piye wong aku juga gak gitu paham yg penting dkerjakan. dah jangan banyak protes, buruan angkut gih bingkisan (aneh) spesialnya. nek gak, tar timpukin lebih banyak lagi lo:p
maaaaaaaaaabbbbb mas mut, buwel balik ke semula lagi......nggak tahu neh....di mozilla error terus setelah pake tutor in......maaaaab mas mut....btw buwel tetep matur thenkyu ya....
maaab nggannguuu mas mut.......buwel make lagi neh tutor nya, hehehehehhehhe...soalnya penyebab error nya udah ketahuan neh, yaitu di Master n friends blog buwel mas mut.....mungkin banyak yang broken link yak, jadi ya dengan ini tutornya buwel pake lagi.....hihhihiihihihi...
makasih sekali lagi mas mut.....dan maaaabbbb ngganggu....
mm mut, untuk yang template ku kan ga ada footernya, apa bisa dibikin yak?
mampir menjenguk, moga lekas sembuh...amiiin
Hmmm, keren juga nih...
Punya saya kebetulan cuma 1 kolom footer'x, hehehhe....
Mantap bro...
Makasih banyak atas infonya.....
:)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} ~x( :-t b-( :-L x( =))
Posting Komentar
[ Kotak Komentar Klasik ]Blue link↑↑diatas↑↑, bisa kalian gunakan saat kalian kesulitan koment karena sedang ngeblog via ponsel.
Tinggalkan jejakmu disini Sob..
komentar kalian adalah semangat buat Semut untuk menerbitkan entri berikutnya.