Selasa, 20 Desember 2016

Cara Membuat Widget Search Box di Blogger

Cara Membuat Widget Search Box di Blogger - Widget search box berfungsi untuk memberikan kemudahan untuk mencari artikel dengan kata kunci atau keyword. Biasanya setiap blog atau website selalu memilikinya, pemilik blog atau website sengaja memberikan widget ini utuk kemudahan pengunjung dalam mencari dengan kata kunci. Widget Search Box yang akan saya bagikan kali ini sangat lah simple dalam bentuk dan simple pula dalam penerapan nya. 

Cara Membuat Widget Search Box di Blogger

Seperti itulah wujud dari search box yang akan kita terapkan dengan kode yang akan saya bagikan. Untuk cara nya sangat lah mudah, kalian hanya perlu login ke blogger dan masuk ke tata letak kemudian tambah widget baru, pilih HTML/Javascript kemudian paste kode berikut ke dalam nya.

<style>
#abt-search-btn {
background: none repeat scroll 0 0 #359BED;
border: 0 none;
border-radius: 0 0 0 0;
color: #FFFFFF;
font-weight: 700;
padding: 10px 20px;
}
#abt-search-box {
background: none repeat scroll 0 0 #EEEEEE;
border: 0 none;
padding: 10px;
width: 160px;
}
</style>
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="abt-search-box" name="q" size="40" type="text" placeholder=" Cari di sini "/>
<input id="abt-search-btn" value="Search" type="submit"/>
</form>


Kustomisasi :


  • Untuk merubah warna latar belakang button Search nya, kalian bisa mengganti kode #359BED dengan kode warna yang kalian suka
  • Untuk latar belakang box search nya kalian bisa merubah kode #EEEEEE dengan kode warna lain.
  • Untuk teks nya, kalian bisa mengganti kata "Cari di sini" dengan kata kata yang kalian inginkan.
Terakhir kalian save widget nya, dan lihat hasil nya..


EmoticonEmoticon