Cara Membuat Footer 3 Kolom Di Blog

Sebelumnya saya membuat artikel tentang Cara Membuat Footer 2 Kolom Di Blog. Kali ini saya akan coba Cara Membuat Footer 3 Kolom di Blog.

Setiap template mungkin berbeda beda fungsi tapi segala hal bisa dimodifikasi sedemikian rupa. Lihat screen shoot 3 kolom footer di bawah ini:

Tertarik untuk membuatnya? Bagaimana cara membuatnya?

Cara Membuat Footer 3 Kolom Di Blog:

1. Login ke akun Blogger
2. Pilih Template >> Edit HTML
3. Copy-paste script berikut di atas kode ]]></b:skin>

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

4. Cari kode yang mirip dengan kode berikut ini:



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

atau


<div id='footer'>
<b:section class='footer' id='footer' showaddelement='yes'/></div>

5. Copy-paste script berikut di bawah kode <b:section class='footer' id='footer' showaddelement='yes'/> atau <b:section class='footer' id='footer' />

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

<div id='footer1' style='width: 33%; 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: 33%; 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: 33%; float: right;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col3'
preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>
</div>

Catatan: Jika di template yang digunakan tidak ada kode <b:section class='footer' id='footer' showaddelement='yes'/> maka tambahkan saja script-nya dibawah kode <div id='footer'>
6. Simpan Template. Lihat hasilnya di Tata Letak, cek apakah ada elemen baru muncul.

Itulah sekilas pemahaman saya tentang Cara Membuat Footer 3 Kolom Di Blog. Baca juga:

• Cara Membuat Footer 2 Kolom Di Blog

Jika mencari artikel yang serupa silahkan cek di bawah ini: