Cara Membuat Kotak Pencarian di Blog

How To Make The Search Box in Blog  -  oke kali ini saya akan share tentang Cara Membuat Kotak Pencarian di Blog  cara ini sangat diperlukan bagi template agan yang kotak pencariannya tidak ada, namun jika sengaja dihilangkan maka cara ini sangat sampah, namun tidak ada salahnya saya mencoba membagi ilmu bagi para pengunjung/sahabat Tips Trick kali ini. 

Cara ini tidak diperlukan jika kotak pencarian (search box) sudah ada di template/blog anda

langsung saja sob, cara ini sangat mudah dan gampang, jika ingin menambahkan search box/kotak pencarian di blog anda, silahkan ikuti langkah langkah yang dibawah ini : 

1. Masuk ke Akun Blogger
2. Klik Tata Letak
3. Klik Tambahkan Gadget/add gadget
4. Klik HTML/Javascript
5. Taruh kode dibawah ini di HTML/Javascript yang dipilih tadi

<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/AVvXsEgYJIREITTRkGyBR5gp92ogMueTWJtLeb-jqcozTAgab6QQOZkwoxloLYdXizRxzjhrdy1dUZyZCxOsYvND0apTnXqtHjfKdDgcSOii8mD-fhWpKcjIAkXnZtdLCHGzHnRPnpBBREBKKEA/s1600/Search.png) center right no-repeat;
}
#s::-webkit-input-placeholder, #s:-moz-placeholder {
    color: #607078;
}
</style>

Maka hasilnya akan seperti ini 

Sekian dulu sob penjelasan mengenai Cara Membuat Kotak Pencarian di Blog  semoga postingan kali ini bermanfaat bagi yang membaca dan mengunjungi blog ini, Terimakasih

Tweet

Posted by Unknown