Cara membuat 3 kolom di atas footer

Hallo sobat blognya reggy, kita akan membahas lagi tentang tutorial blogspot. Mungkin pemasangan widget di sidebar sobat sudah penuh. Nah, alangkah baiknya untuk memasang 3 kolom di atas footer ini, yaitu seperti saya. Jadi sobat bisa memasang widget di 3 kolom ini. Cara memasangnya cukup mudah kok sobat, ikuti langkah - langkah di bawah ini ok?

1. Login pada blog sobat
2. Langsung ke halaman Template kemudian Edit HTML
3. Expand Template Widget
4. Cari kode ]]></b:skin> letakkan kode di bawah ini di atas kode tersebut
#footer-bottom {
width: 900px;background:#fff;
position: relative;display:inline;
clear:both;
margin:0 auto 0;
color:#000;
float: left;
padding:10px;
}
#left-bottom {
width: 270px;
float: left;display:inline;
margin:10px 5px 0 5px;
padding:5px
}
#center-bottom {
width: 280px;
float: left;
margin:10px 5px 0;
padding:5px
}
#right-bottom{
width: 270px;
float: left;display:inline;
margin:10px 5px 0;
padding:5px
}
5. Lalu cari kode <div id='footer'> dan letakkan kode di bawah ini di atas kode tersebut
<div id='footer-bottom'>
<b:section class='footer-bottom' id='left-bottom' preferred='yes' showaddelement='yes'>
</b:section>

<b:section class='footer-bottom' id='center-bottom' preferred='yes' showaddelement='yes'>
</b:section>

<b:section class='footer-bottom' id='right-bottom' preferred='yes' showaddelement='yes'>
</b:section>
</div>
6. Simpan dan lihat hasilnya

Keterangan:
  • Kode yang berwarna merah adalah ukuran masing - masing kolom, bisa sobat ganti dengan kemauan sobat sendiri
  • Kode yang berwarna biru adalah warna background nya bisa sobat ganti dengan kemauan sobat sendiri. Klik Disini untuk mengecek kode warna
Selamat Mencoba!!! :D

44 comments:

  1. makasih mas atas infonya...........

    ReplyDelete
  2. reggy,ini template downloadnya dimana ya??
    saya mau pakai

    ReplyDelete
  3. Thank infonya mas bro...
    Sangat membantu untuk blog toko online saya....

    ReplyDelete
  4. Makasih gan infonya. blog ane jadi terbantu. kunjungi yah :)

    ReplyDelete
  5. trims sob infonya kapan kapan dicoba, salam kenal dan silahkan mampir

    ReplyDelete
  6. wah mas. makasih kali atas info nya. akhirnya blog saya ada footer nya. thanks banget mas.

    blogwalking di blog saya ya mas..

    ReplyDelete
  7. nanya.
    kalo mengatur footer yg di bawah post gimana ya?
    misalnya ngatur posisi label, author sama lokasi dll. soale udah diatur di design tapi balik lagi kayak semula

    ReplyDelete
  8. div id='footer kode tersebut kok gak ada yah di blog ane gan ,,, gmn dong ><?

    ReplyDelete
  9. itu nambahxk bawah apa kesamping ya???

    ReplyDelete
  10. terimakasih gan infonya benener2 ajib

    ReplyDelete
  11. kunjungi blog saya gan , http://akangyanto.blogspot.com/

    ReplyDelete
  12. thx sob, sudah di praktekkan dan berhasil :D

    ReplyDelete
  13. tahnk ni ilmu dan caranya ,,tapi jika ingin mengecilkan pont atau judulnya gimna gan ,,gede semua masalahnya

    ReplyDelete
  14. terimakasih banget info nya...

    ReplyDelete
  15. gan kalo kode nomer 5 diatas ga ada gmna gan???

    ReplyDelete
  16. Thanks banget sob, mampir juga ya ke blogku!

    ReplyDelete
  17. Thank Sobat..Salam kenal

    http://okeshared.com

    ReplyDelete
  18. makasi mas infonya, dan oh ya kalo suka film horor, aku ada situsnya dan coba diliat aja ok , mkasi ya infonya

    ReplyDelete
  19. Kalau mau buat 4 kolom, apa yang harus ditambah ya mas?
    Thanks dah sharing yang bagus2.
    Salam kenal dari Direktori Penerjemah Indonesia.

    ReplyDelete
  20. div id='footer kode nya gak ada, terus gmn?

    ReplyDelete
  21. ane malah ndak tahu yang simple temolate tuh footernya gmn yah ngeditnya susah amat sih

    ReplyDelete
    Replies
    1. klo template simple mending langsung aja buat footernya di Template lalu Sesuaikan. itu udah ada banyak pilihnan tentang kolom"nya kok :)

      Delete
  22. keren gan infonya, ni yang tak cari...

    ReplyDelete
  23. keeren infonya gan....
    http://yadi000.blogspot.com/

    ReplyDelete
  24. kok nggak bisa gan
    so kode ini
    div id='footer'> nggak ada aq cari blog aq gannn

    ReplyDelete
  25. punya saya tidak ada div id='footer'

    terus gimana gan?

    ReplyDelete
  26. Nice artikel,,, sya Search di google ada di PERTAMA

    Kunjungan Baliknya Saya Tunggu

    ReplyDelete
  27. jd keren euy blog sayya dng ada'a footer

    ReplyDelete
  28. Nice...it's work
    Thanks ya sudah bagi2 ilmu

    ReplyDelete
  29. Makasih sob unutk informasi artikelnya :)
    http://goo.gl/NcIh6Z

    ReplyDelete
  30. thanks bro udah share, ane coba dulu

    ReplyDelete
  31. keren om sudah saya coba di templat ciptaan mas sugeng

    ReplyDelete

  32. imo install
    imo beta
    imo messenger
    imo online
    It has a beautiful interface, but even more, a reason to buy it is its reliability.

    ReplyDelete

Berkomentarlah dengan baik dan sopan. Dilarang oot dari artikel diatas. Komentar yang menyertakan link aktif maupun statis termasuk promosi akan langsung kami hapus.