Kali ini saya akan
membahas Tutorial Membuat Widget Search Keren di Blog. Widget
Search/Kotak pencarian ini telah di modifikasi dari segi bentuk sehingga
terlihat lebih menarik dan keren. Kalau tentang memperberat blog, saya
rasa sama sekali tidak memperberat blog. Contohnya seperti gambar
dibawah ini :
Berikut Tutorialnya :
- Pertama-tama, harus login ke blogger terlebih dahulu
- Pilih Rancangan, Elemen laman, lalu Klik Tambah Gadget
- Copy kode dibawah di HTML/Javascript
<style type="text/css">
#search{position:absolute;top:80px;right:200px}
.search
form{width:260px;height:30px;background:transparent
url('http://4.bp.blogspot.com/-6sVCcXv5sLw/Tkl5X1gF0KI/AAAAAAAAASY/AWOycgLsW1M/s1600/searchform.png')
no-repeat 0 0;position:relative}
.search
input#search-text{position:absolute;left:10px;top:0;border:0;background:none;width:150px;height:30px;line-height:25px;color:#7b7b7b}
.search
input#search-submit{position:absolute;top:0;right:0;width:73px;background:none;border:none;cursor:pointer;height:26px;line-height:26px}
.status-msg-wrap{display:none}.status-msg-body{display:none}
.status-msg-border{display:none}
</style>
<div id='pencarian'>
<div class='search'>
<form action='/search' id='search-form' method='get'>
<input id='search-text' name='q' placeholder='Pencarian Kata Kunci' type='text'/>
<input id='search-submit' name='' type='submit' value=''/>
</form>
</div>
</div>
