Widget Form Search Engine for Blogger

Dalam sebuah blog/web tentunya hampir 99% pasti akan menyertakan sebuah kotak pencarian untuk memudahkan pengunjung dalam mencari sesuatu, namun tidak sedikti juga yang tidak menyertakan kotak pencarian karena beberapa alasan, mungkin alasannya adalah sebagai berikut :

1. Sudah menyediak halaman sitemap jadi tidak memerlukan search form.
2. Loading blog berat.
3. Berpikir bahwa pengunjung tidak akan menggunakan search form pada blognya.

Namun bagi anda yang ingin menyediakan kotak pencarian pada blog anda sebagai fitur tambahan bagi para pengunjung blog anda, anda dapat dengan mudah menambahkannya dengan menuju Tata Letak > Add New Gadget > Search Form, atau dengan membuat sebuah widget pencarian sendiri.

Dibawah ini ada satu kotak pencarian yang mungkin bisa anda gunakan pada blog anda.

Pertama silahkan login akun blogger anda, dan silahkan menuju template kemudian silahkan cari kode ]]></b:skin> kemudian letakkan kode dibawah ini sebelum (di atas) kode ]]></b:skin>

.searchform {background: url(https://lh5.googleusercontent.com/-tihBRy5ftiI/UmLOuzEDBxI/AAAAAAAAAJA/pIheWO76kXw/s550/jurucoding-search.png) no-repeat; width:550px;height:47px; display: inline-block;zoom: 1; /* ie7 hack for display:inline-block */ *display: inline;border: solid 0px #ccc;padding: 0px;} .searchform input {font: normal 12px Arial, Helvetica, sans-serif;padding:6px;} .searchform .searchfield {background: #e5e5e5;width: 416px;outline: none;margin:5px 2px 0px 5px;;border-top:1px solid #888;border-left:1px solid #888;border-right:1px solid #ccc;border-bottom:1px solid #ccc;} .searchform .searchbutton {background: url(https://lh5.googleusercontent.com/-xqhs_7_uXsk/UmLPC693lmI/AAAAAAAAAJI/8HCsux2HrXc/h96/jurucoding-button-search.jpg) no-repeat;height: 28px; width: 104px;border:none;}

Kemudian simpan Template anda.

Selanjutnya silahkan menuju Tata Letak,  dan tambahkan gadget baru, pilih HTML/JavaScript, kemudian letakkan kode berikut :

<form action=' /search' class='searchform' method='get'>

<input class='searchfield' id='q' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;&quot;;}' onfocus='if (this.value == &quot;&quot;) {this.value = &quot;&quot;}' type='text' value=''/>

<input class='searchbutton' type='submit' value=''/>

</form>

Selanjutnya simpan dan lihat hasilnya.

Bagaimana? Mudah bukan?