Membuat Header Blog Menjadi Dua Bagian

Header Template blog pada umum nya cuma memiliki satu bagian memanjang, nah untuk menambahkan fungsi agar lebih fungsional, maka header template blog dibagi menjadi dua bagian, berikut caranya:

1. Login ke akun blog anda
2. klik tat letak dan pilih edit html
3. Cari kode seperti dibawah ini

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}

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

4. Hapus kode tadi dan ganti dengan kode seperti dibawah ini

#header-wrapper {
width:930px;
margin:0 auto 0px;
background:#38610B url(http://i33.tinypic.com/sw6cfo.jpg) no-repeat top center;
height:180px;
}

#head-inner {

width:500px;

background-position: left;
margin-left: auto;
margin-right: auto;
float:left;
}

#header {
margin: 0px;
text-align: left;
color:#ffcc66;
}

#r_head{

width:430px;

float:left;

padding-top:10px;

}

5. Cari lagi kode seperti dibawah ini

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

6. Hapus kode diatas dan ganti dengan kode dibawah ini

<div id='header-wrapper'>
<div id='head-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>

<div id='r_head'>

<b:section class='header' id='header2' preferred='yes'/>

</div>

</div>

Anda bisa melakukan pengeditan sesuai yang anda mau pada kode hijau diatas, jika tidak ingin perubahan, klik simpan.

sumber: Cara membuat header blog menjadi dua kolom, membuat header blog menjadi dua bagian, membagi header blog menjadi dua kolom.