Cara Membuat 3 Kolom Dibawah Header
Wah memang ternyata susah banget ya jari ini kalo udah sehati sama blog enggak mau di pisahin dah.... udah 3 hari lebih enggak posting karena lagi sibuk buat template tapi pada akhir nya sekarang saat nya untuk ngeluangin waktu berposting dan berbagi dengan para sahabat-sabahat blogger tercinta....
baiklah saya akan kasih sedikit ilmu yang tentunya bermanfaat bagi sahabat blogger semua hehehehehe kayak mbah dukun aja yeeee... Langsung TKP gannn tanpa harus banyk bosa basi...
Dan sebagai berikut cara-cara untuk membuat 3 kolom dibawah header...
1. Masuk ke akun Blogger sobat.
2. Klik Rancangan > Edit HTML.
3. Klik Download Template Lengkap untuk membuat salinan template. Hal ini untuk mengantisipasi jika nanti terjadi kesalahan dalam pengeditan kita dapat dengan mudah mengembalikan template ke seperti semula.
4. Cari kode ]]></b:skin> Untuk mempercepat pencarian, silakan tekan Ctrl + F lalu masukkan kodenya.
6. Copy kode di bawah ini dan paste di atas kode ]]></b:skin>.
#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
7. Cari kode <div id='main-wrapper'> bila tidak ada, silakan cari <div class='main-outer'>.
8. Copy kode di bawah ini dan paste di atas salah satu kode tersebut.
<div id='box-main-container'>
<div id='box1' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>
9. Klik tombol SIMPAN TEMPLATE.
Dan setelah itu saya ucapkan selamat mencoba untuk para sobat blogger tercinta....
Categories:
Tips Blog
0 komentar:
Posting Komentar