Clean Search Box For Blogspot

HaiSob apa kabar? pada kesempatan ini saya akan membagikan sebuah widget blogger yaitu Clean Search Box untuk Blogspot Blogger. Fungsi Search Box di blog untuk memudahkan pengunjung mencari data atau informasi yang mereka butuhkan dan mungkin ada atau tersedia di blog kita.

Di beberapa template, widget pencarian ini sudah dicantumkan, namun bagi yang belum ada jangan khawatir karena kamu bisa membuatnya sendiri, entah mau kamu pasang pada menu navigasi blog kamu atau bisa kamu tambahkan di sidebar blog kamu. (baca juga: search form dengan ajax jquery)

Kotak Pencarian (Search Box) di Blogger


Clean Search Box For Blogspot
Clean Search Box For Blogspot


Berikut adalah kodenya: 

  <style>
#haisob-searchsimplebox1 { padding:10px; ; }
#haisob-searchsimplesubmit1 { border:1px solid orange; background:orange; padding:5px; color:#ffffff; font:14px verdana; ; }
#haisob-searchsimpleinput1 { -moz-border-radius:10px; -khtml-border-radius:10px; -webkit-border-radius:10px; border:1px solid #dcdcdc; background:#ffffff; padding:5px; color:#888888; font:14px verdana; ; }
</style>
<div id='haisob-searchsimple1'>
         <form action='/search/max-results=8'  method='get' id="haisob-searchsimplebox1">
            <input name='q' id='haisob-searchsimpleinput1' onblur='if (this.value == "") {this.value = "Search this site...";}' onfocus='if (this.value == "Search this site...") {this.value = ""}' type='text' value='Search this site...'/>
            <input id='haisob-searchsimplesubmit1' type='submit' value='Search'/>
         </form>
      </div>

Cara memasang Clean Search Form di Blogger


1. Di Blog kamu 😄
2. Pilih menu Tata Letak  ➜ Tambahkan Gadget.
3. Kemudian pilih widget HTML/JavaScript
Cara memasang Clean Search Form di Blogger
Tata Letak ➔ Tambah Gadget ➔ HTML / Javascript

4. Masukan kode dikolom yang tersedia
5. Save widget.

Sekian Clean Search Box For Blogspot, semoga bermanfaat.