Cara Membagi 2 Kolom Header

Sobat blogger, zona header, memang zona yang stragtegis untuk memasang iklan banner. Masalahnya, bagaimana bila header kita tidak memiliki Gadget untuk menaruh banner/iklan ?

Ya, harus dibuat. Mari kita buat bersama ..

• Log in ke blogger >> dashboard >> layout >> Edit HTML
• Jangan klik "Expand Widget Templates"
• Cari kode di bawah ini :

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

• Ganti kode di atas dengan kode di bawah ini :

#header {
float:left;
width:40%;
height:100px;
margin: 0px;
border: 0px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

#header2{float:left; width:60%; height:100px}

Note : Anda bisa mengubah tinggi (height) dan lebar (width) nya jika mau.

• Kemudian, cari kode di bawah ini :

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='JUDUL-BLOG-ANDA (Header)' type='Header'/>
</b:section>
</div>

Notes : JUDUL-BLOG-ANDA adalah judul asli blog Anda. Misal, seperti blog ini, judul nya "Ricdetop", maka ganti JUDUL-BLOG-ANDA dengan Ricdetop

• Ganti kode di atas dengan kode di bawah ini :

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='JUDUL-BLOG-ANDA (Header)' type='Header'/>
</b:section>
<b:section class='header' id='header2' maxwidgets='4' showaddelement='yes'/>
<div style='clear:both;'/>
</div>
<!-- end header-wrapper -->

• Simpan template dan lihat hasilnya.

 Jika sukses, akan ada kolom baru/gadget baru di sebelah Header/Judul Blog.

Semoga manfaat ...