Cara Membuat Footer 4 Kolom Pada Blog

Cara Membuat Footer 4 Kolom Pada Blog - Kolom footer berada paling bawah pada blog, kolom footer ini sering anda lihat di situs-situs berita. Jika anda tertarik untuk membuat footer menjadi 4 kolom, berikut langkah-langkah cara membuat footer 4 kolom pada blog. Mangga disimak dan di praktekan.

1. Setelah login ke blogger pilih Template » Edit HTML

2. Pasang kode dibawah ini tepat diatas kode ]]></b:skin>

#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}

3. Kemudian anda cari kode seperti dibawah ini

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

4. Hapus kode <b:section class='footer' id='footer'/> kemudian ganti dengan kode dibawah ini

<div id='footer-column-divide'>

<div id='footer1' style='width: 25%; float:left;

margin:0; text-align:left;'>

<b:section class='footer-column' id='col1'

preferred='yes' style='float:left;'/>

</div>

<div id='footer2' style='width: 25%; float: left;

margin:0; text-align: left;'>

<b:section class='footer-column' id='col2'

preferred='yes' style='float:left;'/>

</div>

<div id='footer3' style='width: 25%; float: right;

margin:0; text-align: left;'>

<b:section class='footer-column' id='col3'

preferred='yes' style='float:right;'/>

</div>

<div id='footer4' style='width: 25%; float: right;

margin:0; text-align: left;'>

<b:section class='footer-column' id='col4'

preferred='yes' style='float:right;'/>

</div>

Baca juga :
» Cara Mudah Membuat Tombol Share Melayang Di Kiri Blog
» Cara Mudah Membuat Tombol Share Keren Dibawah Postingan
» Cara Paling Mudah Membuat Menu Navigasi Melayang Pada Blog

5. Simpan Template dan lihat hasilnya

Demikian cara membuat footer 4 kolom pada blog, selamat mencoba dan semoga berhasil. Terima kasih atas kunjungannya and happy blogging.

Please Share » » Facebook Google+ Twitter