Sebelumnya saya sudah membahas cara membuat footer 3 kolom di blog, dan sekarang saya akan membahas cara membuat 2 kolom footer di blog.
Untuk cara membuatnya silahkan ikuti langkah-langkah sebagai berikut:
1. Login ke blogger
2. Pilih blog > Template > Edit HTML > Centang Expand Template ( Sebelum Pengeditan ini disarankan untuk mem backup template di Cadangan / Pemulihan)
3. Jika sudah, Cari kode ]]></b:skin> (Gunakan CTRL + F untuk mempermudah pencarian).
4. Kemudian tambahkan semua kode berikut diatas atau sebelum kode ]]></b:skin>
#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}
5. Selanjutnya, Cari salah satu kode berikut di bawah ini. (Gunakan CTRL + F kembali untuk mempercepat pencarian). Cari salah satu kode saja.
<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>
6. Jika sudah ketemu kodenya, tambahkan kode dibawah atau sesudah 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: 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>
7. Klik Preview atau Pratinjau, bila tidak ada yang eror silahkan save dan lihat hasilnya.
No comments:
Post a Comment