Cara Membuat Kotak Search DiBlog

Cara Membuat Kotak Search DiBlog


Hai Sobat...!
Setelah sekian lama hilang dari dunia perbloggeran, Akhirnya saya memunculkan diri saya di blog kumuh saya ini.

Kali ini saya akan Share Artikel Yang lain dari yang lain...!
Yaitu tentang Search Box

Kotak Pencarian atau dalam Bahasa Ingris Search Box sangat diperlukan dalam sebuat blog atau website.Karena dengan Gadget ini bisa mempermudah  Pengunjung untuk mencari artikel yang dikehendaki.Dan ini juga bisa membuat pengunjung betah!

Selain itu juga membuat blog sobat menjadi keren Maka itu Search Box sangat diperlukan bagi sebuah blog.Oke Langsung saja ini dia cara caranya....:

1. Login ke Blogger
2. Klik  Tata letak
3. Klik Pada Add a Gadget atau Taumbahkan Gadget
4. Lalu Klik HTML/Javascript
5. Pastekan Kode dibawah ini :

<span style='float:right;'>
<style type="text/css"> #a-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXYemrjsZnZMh7NTO69cDpdASkgfFhcqdn_5FZap79HkpORIdGjkbb-gVZoIfOvjPtY9G57Na4FA-07WB3LhQnsUn0j7HJ7TsdOD6eZH6jLwqYaku15GLvSPLBS4su25e1Te6vE5rAniDX/s1600/search.box.png) no-repeat scroll center center transparent;width:300px;height:35px;disaply:block;} form#a-searchform{display: block;padding: 10px 12px;margin:0;} form#a-searchform #a{padding: 0px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#a-searchform #abutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="a-searchbox"><form id="a-searchform" action="/search" method="get">    <input type="text" id="a" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="abutton" /> </form></div>
</span>

Silahkan Ganti yang berwarna biru itu dengan kata kata sobat sendiri karena kata itu yang kana ditampilkan di Search Box Kalian.
Maka hasilnya kaan seperti yang diatas tadi...!

demikian yang dpaat saya sampaikan lebih dan kurangnya mohon dimaafkan....!
Previous
Next Post »

4 comments

Click here for comments
Anonymous
24 February 2014 at 21:24 ×

bagus nih gan, bermanffat bgt buat nubie

Balas
avatar
admin
24 February 2014 at 21:25 ×

nice broo... lanjut,, bookmark aja deh, sebagai pengetahuan

Balas
avatar
admin
Thanks for your comment