Kali ini saya akan berbagi tentang cara membuat footer menjadi 3 kolom. Blogger sendiri sudah menyediakan pilihan footer 3 kolom, tapi buat kamu yang masih menggunakan tampilan footer 1 kolom dan ingin mengubahnya secara manual kamu bisa ikuti langkah-langkahnya.
1. Masuk Blogger dulu pastinya >>
2. Pilih Rancangan >>
3. Edit HTML, back-up template >>
4. Centang Expand Widget Template.
Carilah kode ]]></b:skin>, biar gampang carinya tekan tombol Ctrl+F.
Kalau sudah ketemu copykan kode berikut tepat di atas kode ]]></b:skin>
#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}
Selanjutnya cari kode seperti ini :
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
Jika sudah ketemu hapus kode <b:section class='footer' id='footer'/> kemudian ganti dengan 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>
Selesai sudah jangan lupa disimpan ya templatenya
Semoga Bermanfaat
Sekedar menambahkan postingan, sebelumnya saya sudah membahas bagaimana Cara membuat footer menjadi 4 kolom kali ini saya akan membahas membuat footer menjadi 4 kolom.
1. Masuk Blogger dulu pastinya >>
2. Pilih Rancangan >>
3. Edit HTML, back-up template >>
4. Centang Expand Widget Template.
Carilah kode ]]></b:skin>, biar gampang carinya tekan tombol Ctrl+F.
Kalau sudah ketemu copykan kode berikut tepat di atas kode ]]></b:skin>
#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}
Selanjutnya cari kode seperti ini :
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
Jika sudah ketemu hapus kode <b:section class='footer' id='footer'/> kemudian ganti dengan 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>
Selesai sudah jangan lupa disimpan ya templatenya
Semoga Bermanfaat
Sekedar menambahkan postingan, sebelumnya saya sudah membahas bagaimana Cara membuat footer menjadi 4 kolom kali ini saya akan membahas membuat footer menjadi 4 kolom.
Tweet |
Anda Sudah Membaca Cara Membuat Footer Menjadi 3 Kolom
Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan share Facebook like diatas/sharing tool. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku. (MENCURI adalah pekerjaan PENGECUT ! © room-tutorial.blogspot.com)
0 komentar:
Posting Komentar