Sabtu, 05 April 2014

Cara Membagi Judul Blog (Header) Menjadi Dua Kolom


membagi judul blog menjadi 2 kolom



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='Tweak My  Blogger (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.
Selamat mencoba. Jika berhasil, beritahu kami. Pun jika tidak berhasil beritahu kami sehingga kami bisa memperbaiki kode-kode di atas.

Tidak ada komentar:

Posting Komentar