Cara Membagi Header Template Menjadi Dua Kolom

Cara Membagi Header Template Menjadi Dua Kolom – Di template baru, template bawaan Blogspot seperti kita tau headernya hanya memiliki satu kolom. Mungkin kita merasa kurang puas dan ingin membagi headernya menjadi dua bagian.

Ikuti saja langkah-langkahnya dibawah ini, cara membagi header template menjadi dua kolom :

– Masuk ke akun Blogger anda
– Dashboard
– Rancangan
– Edit HTML
– Centang Expand Template Widget

– Cari kode seperti ini, cari yang mirip:

.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;}

– Jika sudah ketemu hapus dan ganti dengan kode di bawah ini:

.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;min-height: 145px; /* untuk mengatur tinggi header (height) */
}
#header {
width: 45%; /* untuk mengatur lebar header kiri – title, description, image */
margin-right: 10px;float: left;
}
#bgsGR_headerkanan {
float: right;
width: 49%; /* mengatur lebar header kanan */
margin: 20px 10px 5px 10px;
padding: 2px;
}
#bgsGR_headerkanan .widget {margin: 3px;}
}

– Setelah itu cari kode seperti ini:

<div class='region-inner header-inner'>

– tambahkan kode berikut dibawahnya:

<b:section class='bgsGR_headerkanan' id='bgsGR_headerkanan' maxwidgets='1' showaddelement='yes'></b:section>

jika ingin menambah lagi susunan kolom kebawah (tambah gadget), maka tulisan yang bercetak tebal, angkanya bisa diganti dengan angka '2'..tetapi agar kedua kolomnya bisa berfungsi sama, anda harus mengganti kode yang satunya lagi, cari lagi kode seperti ini:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Angkanya diganti dengan angka '2' dan 'no' diganti dengan 'yes'

Kedua angka diatas bisa diganti lagi dengan 3, 4 dan seterusnya sesuai jumlah yang kita inginkan.

– Terakhir simpan template dan lihat hasilnya di gambar:

Cara Membagi Header Template Menjadi Dua Kolom

2 comments

Komentar ditutup.