Membuat Footer 3 Column

Footer ibaratkan kaki di dalam blog (foot=kaki) heuheuheu... Ramai yang memandang remeh berkenaan dengan Footer dan ada separuh di antara blogger yang tidak meletakkan apa² pada bahagian ini. Bahagian ini merupakan alternatif untuk meletak Widget ataupun credit pada sesebuah blog. Bagi template default, biasanyahanya tersedia Footer dimana anda hanya perlu menambahkah gadget (Add a Gadget) untuk memasukkan widget kedalamnya dan ianya hanya memiliki 1 column. Di sini aku nak kongsikan dengan kawan² di mana Footer juga sebenarnya boleh dibahagikan kepada 3 column.

Jika sebelum ini anda selalu meletakkan widget di bahagian sidebar, dengan footer 3 column ini anda boleh meletakkan seberapa banyak widget pada bahagian bawah blog anda.

Berikut adalah cara-cara membuat footer 3 column.

1. Login ke ID Blogger atau terus ke Dashboard.

2. Pilih Layout kemudian ke menu tab Edit HTML.

3. Copy coding dibawah dan paste pada bahagian atas </b:skin>

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

4. Kemudian cari code dibawah ini

<div id='footer-wrapper'>

<b:section class='footer' id='footer'/>

</div>

5. Gantikan coding di atas atau boleh juga letakkan dibawahnya dengan coding dibawah ini

<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;'/> </div>

6. Setelah selesai semuanya, SAVE TEMPLATE! Dan anda boleh beralih ke Layout > Page Element dan melihat hasilnya.


Selamat Mencuba!