Cara Membagi Header Menjadi 2 Kolom

Cara Membagi Header Menjadi 2 Kolom - Pada kesempatan kali ini sundaboy akan mencoba membahas bagaimana Cara Membagi Header Menjadi 2 Kolom, ini khusus bagi template yang hanya mempunyai Header 1 Kolom. nah dengan Membagi Header Menjadi 2 Kolom maka sahabat dapat mempergunakan kolom tersebut untuk memasang sebuah iklan.

Sebelum kita membahas tentang Cara Membagi Header Menjadi 2 Kolom sahabat juga bisa membaca artikel sebelumnya yaitu : Cara Membuat Forum Pada Blog, Cara Membuat Tombol Back To Top, Cara Membuat Widget Artikel Terpopuler, Cara Membuat Link Exchange Dengan Sroll.

Baiklah sekarang kalau sahabat tertarik dan ingin Membagi Header Menjadi 2 Kolom, berikut langkah langkah yang harus sahabat lakukan.

1. Login ke Akun Blogger

2. Pilih Rancangan

3. Pilih Edit HTML

4. Download terlebih dahulu template sahabat, untuk menghindari dari kesalahan memasukan kode script

5. Centang Expand Widget

6. Selanjutnya silahkan sahabat cari kode yang mirip dengan kode dibawah ini. untuk memudahkan pencarian sahabat bisa menekan tombol Ctrl+F secara bersamaan.

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

Kalau sudah ketemu Ganti kode script diatas dengan kode dibawah ini :

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

Selanjutnya silahkan sahabat cari lagi kode dibawah ini :

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

NAMA BLOG Cari sesuai dengan nama blog milik sahabat. 

Kalau sudah ketemu silahkan Ganti dengan ode script dibawah ini :

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

NB : sahabat bisa menentukan lebar dan tinggi kolom yang akan sahabat buat, dengan mengganti Width:35% dan height:120px

7. Simpan template dan lihatlah hasilnya

Nah itu Tutorial tentang  Cara Membagi Header Menjadi 2 Kolom yang dapat sundaboy share, kurang lebihnya mohon untuk dimaafkan. good luck

Subscribe to receive free email updates: