Membuat Footer menjadi tiga kolom
Selasa, 27 Januari 2009Mengutak - atik template memang menyenangkan walaupun harus berpikir keras namun hasil dari kerja kita bisa kita banggakan nantinya,untuk membuat kolom footer menjadi tiga ternyata hanya menambah beberapa kode di sana - sini,mari kita lihat bagaimana cara membuat kolom di footer
Sebelum itu coba lihat dulu panjang dari template kamu ( width )
dan jangan lupa klik expand widget
1. Kamu cari dulu kode ]]></b:skin>
2. Taruh kode di bawah ini di atasnya
#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}
3. Kemudian kamu cari lagi kode berikut
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
untuk memudahkan pencarian bila kamu pengguna mozilla bisa tekan ctrl + F
4. Taruh kode ini di bawahnya
<div id='footer-column-container'>
<div id='footer2' 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='footer3' 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='footer4' 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;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding:
10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>
5. Untuk memastikan tidak ada kesalahan silahkan klik pratinjau
6. Bila hasil bisa dilihat dan tidak terjadi masalah silahkan klik simpan
7. Berikutnya kamu pergi ke elemen halaman,tambahkan widget di fotter kamu dengan mengklik tambah gadget.alu klik HTML / Java script.tambahkan widget yang kamu suka
misalnya
<a href="WWW.KONSULTASIBLOGGER.BLOGSPOT.COM"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghll8bZVvyEn2jh8QHSxzHbAAJy9KRwnQly3GvfIYEoTptc-Iy3Osx2pPhyfTNcjmb_uK9n3knG8U444p8aqXNO6Ys9sOQE7S0YTsrRf6LXKzK4LG86JbwWJ8SI8Z48Bq8yRz5zm5dVnQ/s320/KONS+LOGO.png"></a>
lalu pilih simpan,tinggal lihat footer blog menjadi tiga kolom
Selamat mencoba...
Posted in
Blogging stuff
|
0 comments:
Posting Komentar
Silahkan komentar di blog dofollow ini.Boleh berkomentar asal jangan spam ( Tidak sesuai dengan isi blog )Untuk komentar yang cuma Spam dan sedikit terpaksa saya Hapus ^_^