Sebelumnya saya juga share tentang cara membuat 2 kolom element dibawah header,tapi kadang blogger menginginkanya 3kolom dibawah header, biar ada yang ditengah katanya,emang enak ya kalo ada yang tengah2, he he...eh jangan ngeres loh lihat foto kartun disamping,walau kartun mulus juga kan,jangan nafsu juga loh..ha ha ha..dah ah malah nglantur aq,
ok sob ni tutorial tentang bagaimana cara membuat 3 kolom element dibawah header.
1. Pada dasbor klik Tata Letak=> Edit HTML=> Cari kode berikut ]]></b:skin> jika sudah dapat, letakkan kode berikut diatasnya:
#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
ok sob ni tutorial tentang bagaimana cara membuat 3 kolom element dibawah header.
1. Pada dasbor klik Tata Letak=> Edit HTML=> Cari kode berikut ]]></b:skin> jika sudah dapat, letakkan kode berikut diatasnya:
#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
2. Kemudian cari kode <div id='main-wrapper'> setelah dapat letakkan kode beikut diatasnya :
<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>
3. Simpan template dan lihat hasilnya............deh :)
<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>
3. Simpan template dan lihat hasilnya............deh :)
Artikel Terkait
Cara Pasang Iklan PPC di Bawah Postingan
bagaimana sih caranya agar iklan PPC nya bisa berada ditempat yang strategis, alias mudah dilihat oleh pengunjung. D
Cara Pasang Alert di BlogPosting lagi... hari ini kita membahas Cara Pasang Alert di Blog hemm... udh pada tau kan apa itu Alert di Blog, pasti
Memasang Tombol Share Twitter dan FacebookPernah lihat tombol-tombol share seperti di samping kanan atau kiri pada suatu postingan? Ya pernah dong,kan itu ada 
Cara menghilang Icon Obeng dan Tang pada blogBiasa nya ini kita jumpai di setiap sudut elemen di halaman blog. disana akan terdapat icon bergambar obeng dan tang. - CARA MEMBUAT IKLAN POP UP (MELAYANG) Tutorial Menambah Aplikasi Iklan Pop UP atau iklan melayang di blogspotArtikel kali ini adalah Cara Membuat Tampilan Iklan Pop UP (Melayang) di blogger. ini sangat mudah untuk anda buat. ha
- Cara memberi Sound efek | efek suara pada blog cara memberikan sound efek atau efek suara pada blog, info ini saya dapatkan dari teman kita faisal, faisal meminta
Membuat 3 kolom element dibawah header
4/
5
Oleh
Baris Info
Silahkan menuliskan komentar anda pada opsi Google/Blogger untuk anda yang memiliki akun Google/Blogger.
Silahkan pilih account yang sesuai dengan blog/website anda (LiveJournal, WordPress, TypePad, AIM).
Pada opsi OpenID silahkan masukkan URL blog/website anda pada kotak yang tersedia.
Atau anda bisa memilih opsi Nama/URL, lalu tulis nama anda dan URL blog/website anda pada kotak yang tersedia, atau juga bisa URL Facebook atau Twitter kamu, misal http://facebook.com/markutil
Gunakan opsi 'Anonim' jika anda tidak ingin mempublikasikan data anda. (sangat tidak disarankan). Jika komentar anda berupa pertanyaan, maka jika anda menggunakan opsi ini pertanyaan kamu tidak akan ditanggapi.