Membagi Header Blog Menjadi Dua Kolom

Seputar Blog,

Cara Membagi Header Blog Menjadi Dua Bagian (2 Kolom)

TEMPLATE blog bawaan blogger (default) biasanya hanya punya satu kolom di header, sehingga hanya bisa menyimpan nama atau logo blog di sana. Tutorial berikut ini akan memandu bagaimana cara membagi header blog menjadi dua bagian atau dua kolom. Kolom kiri untuk nama blog (logo) dan kolom kanan untuk banner atau iklan --biasanya berukuran 468px.

Bagaimana cara membagi header blog di template bawaan blogger menjadi dua kolom. Ini caranya:

LANGKAH PERTAMA
1. Template > Edit HTML
2. Cari (Ctrl+F) kode yang penampakkannya seperti berikut ini:

<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>
</div>

3. Copy & Paste kode berikut ini di antara kode </b:section> and </div>

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

Hasilnya seperti ini:

<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
</b:widget>
</b:section>
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>
</div>
</div>

4. Copy + Paste kode berikut ini di atas atau sebelum kode ]]></b:skin>

#header, body#layout #header {width:300px;display:inline-block;float:left;}
#header-right, body#layout #header-right {width:468px;display:inline-block;float:right;padding:15px;}
#header-right .widget {margin:0;}

Catatan:

Angka 300 (untuk space nama blog/logo di kiri) dan 468 (untuk space iklan di kanan) bisa diubah. Kalau ragu, biarkan seperti itu.

5. Save template!

LANGKAH KEDUA

1.  Klik Layout

2. Akan muncul kolom buat Widget baru HTML/Javascript di bawah Header seperti gambar di bawah. Edit dan masukkan kode iklan atau url gambar di sana yang akan muncul di samping logo/nama blog.

 

Kurang lebih seperti Itulah Cara Membagi Header Blog Menjadi Dua Bagian