Menambah 3 widget di footer

ikhsanudin on

Tuesday, March 19, 2013

pada posting terdahulu saya telah mebuat sebuah posting yang berjudul Cara menambah gadget dibawah footer jadi 3 kolom, kali ini juga hampir sama yaitu
Menambah 2 widget di footer, Menambah 4 widget di footer, Menambah 4 widget di footer .
langsungkita mulai :
1. login ke blogger.com
2. Template > Edit html dan centang Expant Templat Widget
3. cari ]]> , masukkan kode berikut diatasnya:

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

4. Cari kode : <div id='footer-wrapper'> / <div class='footer-outer'>

5. Copy kode berikut, dan Paste di bawah kode <div id='footer-wrapper'> / <div class='footer-outer'>

Silahkan pilih anda mau Menambah 2 widget di footer, Menambah 4 widget di footer, Menambah 4 widget di footer.

- Untuk 2 kolom
<div id='footer-column-divide'>

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

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



- Untuk 3 kolom
<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>


- Untuk 4 kolom

<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>

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


Setelah memilih satu kode dan tentunya telah di pastekan di tempatnya, lalu KLIK SIMPAN TEMPLATE, dan jika sudah save template, silahkan lihat haisl Cara menambah gadget dibawah footer jadi 3 kolom

Labels: Blogger, Tips dan Trik, Tutorial

Thanks for reading Menambah 3 widget di footer. Please share...!