Halo semua,dan salam blogger.pada pertemuan kita kali ini kita akan membahas CARA MEMBUAT WIDGET SEARCH YANG KEREN.mungkin sebagian pengunjung tertarik untuk menelusuri suatu blog,namun apa jadinya kalau gak ada kotak search.atau karena background blog sama dengan background search,jadi gak bisa ditemukan deh kotak searchnya.
itulah gambar searchnya.jika anda ingin kotak search ini? anda ikuti langkah2 membuat kotak seacrh tersebut.caranya SIMPLE kok.gak susah
2.pilih tata letak dan tambahkan gadget
3.pilih HTML/javascript
4.masukkan kode HTML berikut
<form action="/search" style="display:inline;" method="get">
<input id="s" name="q" type="search" placeholder="Cari Artikel Disini"/>
</form>
<style>
#s {
margin: 0 auto;
-webkit-appearance: none;
-moz-appearance: none;
padding: 12px 48px 12px 12px;
-webkit-border-radius: 200px;
-moz-border-radius: 200px;
border-radius: 200px;
width: 200px;
height: 16px;
color: #3a4449;
border: none;
outline: none;
-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,.3), 0 2px 0 rgba(255,255,255,.3), inset 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 0 0 1px rgba(0,0,0,.3), 0 2px 0 rgba(255,255,255,.3), inset 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 0 0 1px rgba(0,0,0,.3), 0 2px 0 rgba(255,255,255,.3), inset 0 1px 2px rgba(0,0,0,.2);
position: relative;
z-index: 2;
background: #fff
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW_1xBH9Wq7Tn1avrazNov9LkOLTbpZashInsuuMD6e6kWOtV8wIw4PSprBllV2exVcahIX8NQSqbVvtzY9Jd42zj1UHloDQddbKx0POfEVxGG90d5VK7XO7hPGNi6SdOlro6hHpwwmZc/s1600/Search.png)
center right no-repeat;
}
#s::-webkit-input-placeholder, #s:-moz-placeholder {
color: #607078;
}
</style>
5.klik Save atau SIMPAN
6.lihat di blog anda.dan anda punya kotak search yang keren