Seperti janji Karya Anak Kidoel sebelumnya yaitu Karya Anak Kidoel akan memberikan tips lanjutan tentang membuat Footer menjadi Beberapa kolom alias multi kolom , Dan janji tersebut akan Karya Anak Kidoel tepati setelah sebelumnya Karya Anak Kidoel memberikan tips tentang Cara Membuat Footer Menjadi 3 kolom dan cara membuat footer menjadi 2 kolom ,nahh dalam postingan kali ini Karya Anak Kidoel akan memberikan tips tentang Cara Membuat Footer Menjadi 4 Kolom . apa masih mau tambah lagi kolom footernya ? hehehe...
Jangan kebanyakan iia sobat kolom footernya,hehehe nanti sobat sendiri yang bingung mau di apakan itu footer .tapi buat sobat yang masih kurang dengan kolom footernya bisa langsung ikuti langkah-langkah Cara Membuat Footer Menjadi 4 Kolom di bawah ini .
Cara Membuat Footer Menjadi 4 Kolom
1.Seperti biasa Login Dulu ke blogger.
2.Klik Tata Letak.
3.Klik Edit HTML.
4.Selanjutnya silakan sobat cari kode ]]></b:skin> .
5.Jika sudah ketemu Copy dan paste kode di bawah ini tepat di atas kode ]]></b:skin> .
#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}
6.Selanjutnya silakan sobat cari kode dibawah ini .
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
7.Jika sudah ketemu Hapus kode <b:section class='footer' id='footer'/> kemudian ganti bengan kode dibawah ini .
8.Klik Simpan Template .
9.Jika berhasil maka hasilnya adalah seperti di bawah ini .
10.Selamat Mencoba..
Jangan kebanyakan iia sobat kolom footernya,hehehe nanti sobat sendiri yang bingung mau di apakan itu footer .tapi buat sobat yang masih kurang dengan kolom footernya bisa langsung ikuti langkah-langkah Cara Membuat Footer Menjadi 4 Kolom di bawah ini .
Cara Membuat Footer Menjadi 4 Kolom
1.Seperti biasa Login Dulu ke blogger.
2.Klik Tata Letak.
3.Klik Edit HTML.
4.Selanjutnya silakan sobat cari kode ]]></b:skin> .
5.Jika sudah ketemu Copy dan paste kode di bawah ini tepat di atas kode ]]></b:skin> .
#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}
6.Selanjutnya silakan sobat cari kode dibawah ini .
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
7.Jika sudah ketemu Hapus kode <b:section class='footer' id='footer'/> kemudian ganti bengan kode dibawah ini .
<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 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>
8.Klik Simpan Template .
9.Jika berhasil maka hasilnya adalah seperti di bawah ini .
10.Selamat Mencoba..
Tidak ada komentar:
Posting Komentar