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:
- tambahkan kode berikut dibawahnya:
maxwidgets='1'
- 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:background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;}
.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: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;}
}
- tambahkan kode berikut dibawahnya:
Kedua angka diatas bisa diganti lagi dengan 3, 4 dan seterusnya sesuai jumlah yang kita inginkan.
- Terakhir simpan Template dan lihat hasilnya:
No comments:
Post a Comment