Cara Membagi Footer di Blogspot

Cara Membagi Footer di Blogspot. Dewasa kini banyak sekali blogger-blogger yang mencoba menyajikan artikel-artikel berita ataupun yang unik untuk mencari visitor dan pageview. Biasanya blogger yang menggunakan template standar 2 kolom akan mengalami masalah karena minimnya lokasi untuknya berkreasi. Karena pada dasarnya artikel berita ataupun unik itu tidak terlalu mengandalkan search engine untuk mengakses semua kontennya melainkan mengandalkan seberapa bisa template blog yang digunakan bisa menyajikan apa yang ada dalam sebuah blog. Dan bagi pengguna template 2 kolom mungkin penambahan footer bisa menjadi jalan keluar untuk masalah ini. Berikut cara agar footer kita terbagi menjadi 2 atau lebih.

Cara Membagi Footer di Blogspot:

• Langsung saja ke TKP, dashbord =>> rancangan =>> edit html. Kili expand template widget.
• Cari kode ]]></b:skin>  dan letakan kode berikut di atasnya.

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

• Selanjutnya cari kode di bawah ini.

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

• Jika tidak ada cari kode di bawah ini.

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

• Kemudian anda masukkan kode berikut ini tepat di bawah <b:section class='footer' id='footer' showaddelement='yes'/> atau tidak <b:section class='footer' id='footer' />. Jika keduanya tidak ada maka masukan tepat di bawah <div id='footer'>.  

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

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

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

• Simpan pekerjaan anda. Dan sekarang di footer anda telah ada penambahan elemen baru untuk widget. silahkan diisi semau anda.

Selamat mencoba dan salam sukses

Masukkan email anda untuk mendapatkan update artikel kami: