Cara Menambah Footer 3 Kolom di Blogger

Template Blogger kian banyak macamnya. Mulai dari yang berkonsep minimalis, hingga magazine style. Beberapa template baru memiliki footer (letaknya di bawah, karena foot itu artinya kaki..hehehe) tiga kolom, seperti blog ini. Nah, bagaimana cara menambah footer 3 kolom di Blogger atau Blogspot? Bagi anda yang malas ganti template atau sudah sreg dengan template sekarang dan ingin menambah footer 3 kolom, tips ini mungkin berguna.
Oke, langsung saja ke tutorialnya:

1. Masuk Layout, Edit HTML, beri centang (jangan lupa back up dulu buat jaga-jaga).

2. Cari kode: <div id="footer-wrapper">
Ket: pada beberapa template kodenya: footer atau footer-section.

3. Geser ke bawah (biasanya dua baris ke bawah) sampai ketemu kode: </div>

4. Tambahkan kode berikut ini di bawahnya:


<div id="footer">
<div id="footer2" style="margin: 0pt; width: 30%; float: left; text-align: left;">
<b:section class="footer-column" id="col1" preferred="yes" style="float: left;">
</b:section></div>
<div id="footer3" style="margin: 0pt; width: 40%; float: left; text-align: left;">
<b:section class="footer-column" id="col2" preferred="yes" style="float: left;">
</b:section></div>
<div id="footer4" style="margin: 0pt; width: 30%; float: right; text-align: left;">
<b:section class="footer-column" id="col3" preferred="yes" style="float: right;">
</b:section></div>
<div style="clear: both;">
<p>
</p><hr align="center" color="#5d5d54" width="90%"><p></p>
<div id="footer-bottom" style="padding: 10px; text-align: center;">
<b:section class="footer" id="col-bottom" preferred="yes">
</b:section>
</div>
<div style="clear: both;">
</div>


5. Simpan, lalu klik Layout dan lihat hasilnya: akan muncul tiga kolom di bawah (bagian footer).


Apabila muncul galat, wakakaka....tenang. Kembalikan template dengan back up template yang telah kita buat dan ulangi semua tahap. tapi coba dengan jangan centang expand widget template.
Semoga barhasil...

( Sumber : http://wawanwae.blogspot.com )

26 komentar:

  1. syukran infonya...nambah semangat untuk ngeblog

    BalasHapus
  2. Horeee.. sy udah pasang..!! silahkan di cek di http://www.about-computer.co.cc

    BalasHapus
  3. lama ngak nongol kyknya Sibuk ya???
    Nice Tutorial, sy udah coba juga di blog sy..
    emang bisa nambah kolom dan hemat tempat

    BalasHapus
  4. makasih seblumnya. aq pemula banget masalah blog. aq penasaran ne gmn buat slideshow foto sendiri. yang langsung bisa dtyangkan. aq coba lewat slide.com kok gak bisa langsung tampil gitu. tolong bantu ya!? makasih buanyak.........

    BalasHapus
  5. wah kalau cuman satu kolom gimana ya sob aku tunggu jawabanya thank's

    BalasHapus
  6. mas saya sudah menaruh banner anda di tempat saya sekarang giliran anda menaruh banner saya, terima kasih.. salam blogger

    BalasHapus
  7. duh susah kang..
    gimana sih caranya!??
    ????

    BalasHapus
  8. thanks inpo nya,yah gan... ;)

    BalasHapus
  9. tanks wat info yg mnrik Ni....

    BalasHapus
  10. Thank's gan atas info nya,,

    Tugas PTIK jd Lebih mudah euyy,,


    Makasi Byk Gan....

    BalasHapus
  11. sipp thakzz tas infonya
    mantabb

    BalasHapus
  12. as.bang kl bikin template kyak punya mas giman?kasih tau dong bang biar aku punya karya sendiri,aku blm faham masalah html

    BalasHapus
  13. Saya coba belajar modifikasi kolom footer dibagi 3 kok tidak bisa yach, kode ini juga tidak ada tetapi kira2 ketemu yang seperti ini saat dicoba gagal selalu, pada bagian mana saya bisa menambahkan kodenya.
    Terima kasih.

    BalasHapus
  14. Permisi, jalan-jalan Nyari Ilmu, eh ketemu dengan Blog ini, hehehe
    Terimakasih artikelnya Mas, sangat Bermanfaat sekali, salam kenal buat teman2 semua, Jangan lupa, kalau ada waktu Berkunjung ke blog Bujang Riau http://www.darma-saputra.co.cc/, terimakasih ...

    BalasHapus
  15. <hr align="center" <---punya saya errornya di daerah ini mas gimana ya solusinya

    BalasHapus
  16. cara memasang mp3 di blog

    BalasHapus
  17. thank tutorialnya..kok gak mau ya gan..muncul pesan ini..
    XML error message: The element type "hr" must be terminated by the matching end-tag ""... mumet ui..

    BalasHapus
  18. salam kenal....saya aisyah 8 thn
    thanks berkat forantum, sekarang saya sudah punya blog www.kreasi-aisyah.blogspot.com

    BalasHapus

Mau tukeran link? silakan buka Link Sahabat dan apabila ada pertanyaan silakan tulis di Kotak Pertanyaan. Terima Kasih...

Kami akan menghapus komentar yang: Tak sopan, memakai HURUF BESAR, berupa caci maki, mengandung kata-kata kebun binatang, debat kusir, provokasi, di luar konteks, berupa undangan/ reklame. Komentar yang terlalu panjang, tanpa paragraf dan sulit dipahami. Komentar copy-paste, silakan di-link saja.

Isi komentar adalah tanggung jawab penulis komentar, bukan tanggung jawab pengelola blog/situs ini. Harap maklum.