Cara Menambah Add Elemen pada Bagian Header

Thanks telah berkunjung...

Menambah add elemen pada bagian header bertujuan agar kita dapat menambah suatu gadget di lain waktu, mungkin ketika teman2 ingin menambah kotak pencarian blog maka trik ini cocok digunakan. Selain itu sebagian rekan blogger (termasuk saya) menggunakan trik ini untuk menambah gadget menu Horisontal. Nah bagi teman2 yang menginginkan layout/tata letak blognya memilki elemen add gadget tambahan pada bagian header, silahkan langsung peraktek trik yg akan kita bahas dalam postingan kali ini.

Sebagai contohnya, berikut ini adalah tampilan bagian header sebelum ditambah elemen add



Setelah ditambah, maka tampilannya akan seperti berikut ini



Sekarang teman2 pasti sudah pada tahukan bedanya, pada bagian yg telah saya tandai dgn warna merah tersebutlah yang saya maksud dengan add elemen baru atau tambahan, maka untuk membuatnya silahkan login dulu ke blogger, lalu klik Tata Letak dan klik Edit HTML

Selanjutnya Taruh kode berikut tepat di atas kode ]]></b:skin>

#gadget_header{
margin:10px 0;
padding:1%;
width:100%;}

Cari kode <div id='header-wrapper'> dan letakkan kode berikut di atasnya

<div id="gadget_header">
<b:section class='header' id='gadgetheader' preferred='yes'/>
</div>

Simpan hasil kerjaan teman2. Untuk melihat hasilnya, silahkan untuk pergi ke halaman tata letak/layout.

Di atas adalah cara menambah add gadget elemen yg berada tepat di atas bagian header blog. Oleh karena itu, elemen ini cocok digunakan untuk menyimpan gadget seperti form pencarian atau search. Bagi teman2 yang ingin menambah add gadget elemen yg berada tepat di bawah header blog maka teman2 bisa menggunakan trik berikut ini (kalau yg ini cocok digunakan/diisi dengan gadget menu horizontal)

kembali ke halaman edit HTML dan jangan lupa centang kotak "expand widget template", lalu letakkan kode berikut tepat di atas kode ]]></b:skin>

#under_header{
margin:10px 0;
padding:1%;
width:100%;
}

Selanjutnya yang harus teman2 lakukan adalah mencari kode berikut

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

(Kalau memang susah untuk dicari, jangan cari semua kode yang tertera. Cukup cari <div id='header-wrapper'> selanjutnya kalau dah ketemu coba cocokkan dengan kode di atas)


Kalau dah ketemu letakkan kode berikut di bawahnya

<div id="under_header">
<b:section class='header' id='underheader' preferred='yes'/>
</div>

Dah, simpan. Sekarang tengok hasilnya...

Tampilannya nanti akan seperti berikut ini




Kalau tertarik untuk menambah add elemen pada bagian footer, maka tman2 juga bisa membaca postingan yang ini




Semoga Bermanfaat []

Tags: menambah add elemen pada header, cara edit template add elemen, menambah elemen add gadget, membuat elemen tambah gadget header