Cara Membagi Footer Blogger menjadi 3 coloum

Written By Abdul Wakhid on 12 Oktober 2010 | 17.34.00

Bagi rekan rekan blogger pasti sudah mahir  melakukan editing template blog mereka. Jadi maaf saja ya kalau repost .. he… :D . Buat yang baru belajar ini ada beberapa trik untuk melakukan editing template blogger kalian. kali in saya akan membahas tentang bagaimana caranya membagi footer menjadi 3 kolom. Langsung saja ya berikut langkah-langkahnya ;

  1. Login ke blogger.com dan buka halaman edit html.

  2. Backup terlebih dahulu template anda, agar jika terjadi kesalahan anda dapat mengembalikannya seperti semula.

  3. kode   ]]></b:skin> pake saja cntrl + f untuk mempermudah.

  4. Tambahkan kode dibawah ini diatas kode ]]></b:skin>

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

dan cari kode dibawah ini.
div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

5. Hapus kode <b:section class='footer' id='footer'/>  lalu ganti dengan kode dibawah ini.
Jika ingin membuat footer 3 kolom. Gunakan kode dibawah ini:


<div id='footer-column-divide'>
<div id='footer1' 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='footer2' 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='footer3' 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>

Preview terlebih dahulu, jika sudah benar baru bisa sahabat Save Template
Selesai, selamat mencoba.. :D

0 komentar:

Posting Komentar

Don't Spam Please !