Menambah Beberapa Kolom Dibawah Header Blog

a. Menambahkan 1 Kolom dibawah Header Blog

1. Masuk ke akun bloger You
2. Pada dashboard, pilih Templates
3. Pilih Edit HTML
4. Centang Expand Widget Template
5. Tekan Ctrl+F, cari kode ]]></b:skin> dan letakkan kode berikut diatasnya

#one-kolom {margin:10px 0;padding:1%;width:98%;}

6. Cari kode seperti ini

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidget="1" showaddelement="no">
<b:widget id='Header1' locked='true' title='test (Header)' type='Header'/>
</b:section>
</div>

7. Lalu letakkan kode berikut dibawahnya

<div id="one-kolom">
<b:section class='header' id='onekolom' preferred='yes'/>
</div>

8. Simpan template

b. Menambah 2 Kolom Dibawah Header Blog

1. Bereng kode ]]></b:skin> dan letakkan kode berikut diatasnya

#two-kolom {clear:both;}.two-kolom {}

2. Selanjutnya bereng kode <div id='main-wrapper'> dan peakkon kode berikut diatasnya

<div id='two-kolom'>
<div id='kolom1' style='width: 50%; float: left; margin:0; text-align: left;'>
<b:section class='two-kolom' id='kolom1' preferred='yes' style='float:left;'/></div>
<div id='kolom2' style='width: 50%; float: right; margin:0; text-align: left;'>
<b:section class='two-kolom' id='kolom2' preferred='yes' style='float:right;'/></div>
<div style='clear:both;'/></div>

3. Simpan template

c. Menambah 3 Kolom Dibawah Header Blog

1. Lului kode ]]></b:skin> dan baen kode berikut diatasnya

#tolu-kolom {clear:both;}.tolu-kolom {}

2.Lului kode <div id='main-wrapper'> dan baen kode berikut diatasnya

<div id='tolu-kolom'>
<div id='kolom1' style='width: 35%; float: left; margin:0; text-align: left;'>
<b:section class='tolu-kolom' id='kolom1' preferred='yes' style='float:left;'/>
</div>
<div id='kolom2' style='width: 30%; float: center; margin:0; text-align: left;'>
<b:section class='tolu-kolom' id='kolom2' preferred='yes' style='float:center;'/>
</div>
<div id='kolom3' style='width: 35%; float: right; margin:0; text-align: left;'>
<b:section class='tolu-kolom' id='kolom3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>

3. Simpan template