Cara Membagi Header Menjadi Dua Bagian

Sedikit Info buat agan yang mebutuhkan blog dengan header dua bagian kanan dan kiri,
Karena Secara default, blogger tidak memberi pilihan untuk membagi header atau judul blog menjadi dua bagian.
Jika Anda ingin judul blog bisa dibagi menjadi dua kolom sehingga Anda bisa memasang iklan atau gadget lainnya, ikutilah langkah-langkah berikut ini:
Masuk ke blogger Dashboard, klik Template, klik Edit HTML
Jangan centang Expand Widget templates

Cari kode ini:

<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>

Tambahkan kode berikut di bawah kode tadi:

<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>

Sehingga hasilnya akan menjadi seperti ini:

<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 id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>

Sekarang, cari kode ini:
 ]]></b:skin>
Tambahkan kode berikut ini tepat di atas ]]></b:skin>

#header {display:inline-block;_float:left;}
#header-right {display:inline-block;float:right;padding:15px 15px 15px 15px;}

#header-right .widget {margin:0;}

body#layout #header {width: 50%;}

body#layout #header-right {width: 50%;} 


Berikutnya, cari kode:

]]></b:template-skin>


Tambahkan kode berikut di atas kode tadi:

#layout #header {width: 50%; float: left;}

#layout #header-right {width: 50%; float: right;}


Langkah terakhir, SAVE TEMPLATE dan coba anda lihat di Tata Letak (Layout) apakah header blog Anda menjadi dua kolom atau tidak.
Jika Kurang Jelas Silahkan komenkan pertanyaan anda,,
Terimakasih sudah berkunjung semoga Bermanfa'at :D

Tweet