Minggu, 11 Maret 2012

Posted by Oliez On 11.17 No comments

Menambahkan Search Box di Header (blogspot)

Saya adalah blog pemula dimana saya orangnya selalu penasaraan tentang hal apapun yang baru dalam hidup saya yang pasti semuanya positif thinking donk . . .
lihat saja blog saya ini adalah karya sang maha guru www.poppies407 saya berguru padanya tentang hal berselancar di internet terutama dalam hal blogspot beberapa hari yang lalu saya mencoba mempraktekan ilmu yang di berikan oleh sang maha guru hasilnya seperti ini fiqhmuamalah1 blog tersebut belum finis maklum PC ane spesifikasinya tidak memadai alias jadul tapi saya tidak berhenti disitu gugling sana gugling sini alhamdulilah saya menemukan hal yang baru dalam hidup saya, mungkin para blogger mania akan menertawakan saya so itu dah jadul men . . .
hehehehehe
harap maklum para blogger mania ane orang awam hehehehe
Saya baru saja mencoba menambahkan menu search pada header blog. Setelah blog walking kesana kemari, akhirnya saya temukan juga cara yang ampuh. Hasilnya dapat anda lihat di kanan atas blog saya.
Ok, langsung disimak saja,
1. Masuk ke akun blogger
2. Lihat di Dashboard > Design > Edit HTML.
3. Jangan lupa Back up dulu template untuk jaga-jaga.
4. Expand Widget Templates tidak perlu di centang.
5. Cari kode berikut pada HTML code (kodenya tidak akan sama persis):
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='My Test  Blog (Header)' type='Header'/>
</b:section>

6. Tambahkan kode ini setelahnya.
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>


7. Keseluruhan kode jadi seperti ini :
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Blogger Sentral Widget Showcase (Header)' type='Header'/>
</b:section>
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>



8. Selanjutnya masih di edit HTML, cari kode berikut : ]]>
#header, body#layout #header {width:50%;display:inline-block;float:left;}
#header-right, body#layout #header-right {width:35%;display:inline-block;float:right;padding:15px;}
#header-right .widget {margin:0;}

10. Sekarang saatnya menginstall Widget. Pada menu tata letak, klik tambah gadget, kemudian tambahkan kotak pencarian dari google.



‘Tambah Gadget’ kadang terletak di sebelah header, seperti di blog ini :



http://hasilbrowsing.blogspot.com/2012/02/menambahkan-search-box-di-header.html

0 komentar:

Posting Komentar