Menambah Widget Di Samping Header
Menambahkan Widget di samping Header. Sebagian besar blog memiliki fariasi di samping judul blog. Dan sebagian besar juga menambahkan kotak untuk penempatan iklan di samping Judul blog (header). Header yang kita lihat pada tata letak dasbor hanya terdapat 1 kotak. Itu bawaan aslinya. Dan untuk menambahkan widget di samping judul blog (header) menjadi 2 bagian header, yaitu header kiri dan header kanan seperti yang terlihat di atas guna meletakkan banner iklan butuh cara-cara tersendiri. Kita simak tahap demi tahap di bawah ini :
1. Login di blogger yang teman punya.
2. Pilih Templat - buka Edit HTML. Cari kode script .header-outer{
Kode lengkapnya seperti ini :
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;
}
3. Silakan ganti seluruh kode di atas dengan kode di bawah ini:
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;_background-image: none;min-height: 104px;}
#header {
width: 40%;
margin-right: 10px;float: left; }
#headerkanan {
float: right;
width: 54%;
margin: 20px 10px 5px 10px;
padding: 2px;}
#headerkanan .widget {margin: 3px;}
Keterangan skrip:
min-height: 104px;} = Tinggi Header. Ubah sesuai yang diinginkan
width: 40%; = Perbandingan lebar header kiri dengan luas blog. Setting sesuai yang diinginkan.
width: 54%; = Perbandingan lebar header kanan. Bisa disesuaikan dengan yang diinginkan.
margin: 20px 10px 5px 10px; = Jarak atas - bawah header kanan. Bisa disesuaikan dengan yang diinginkan.
5. Cari kode <div class='region-inner header-inner'> dan copy kode scrip di bawah ini :
<b:section class='headerkanan' id='headerkanan' maxwidgets='1' showaddelement='yes'></b:section>
6. Paste kode di atas tepat disamping kode <div class='region-inner header-inner'> ini. Sehingga menjadi :
<div class='region-inner header-inner'><b:section class='headerkanan' id='headerkanan' maxwidgets='1' showaddelement='yes'></b:section>
7. Pratinjau dulu templat yang kita inginkan. Jika sudah sesuai Klik Simpan. Silakan teman atur sendiri pengaturannya sesuai dengan keterangan kode di atas. Seperti contoh di atas.
Dengan Penambahan 1 kolom widget di samping header, akan membuat penampilan blog menjadi semakin menarik. Dan akan menghemat ruang halaman blog kita.
Leave a Comment