Cara membuat search di web html

Cara Membuat memasang Widget Search Box Kotak Pencarian Yang Mengarahkan link Ke Google Di blogger ~ Halo sobat blogger kali ini admin jagoan kode akan memberikan sedikit tips dan trik mengenai bagaimana cara membuat kotak pencarian atau search box yang bila diketik katanya maka secara otomatis keyword atau kata kunci akan diarahkan ke google dan menyertakan link blog yang kita punya Kali ini saya akan berbagi tips untuk pembuatan kotak pencarian yang nanti hasilnya akan mengarah langsung ke google dengan menampilkan isi konten yang kita miliki.

Sebenarnya banyak yang sudah memasang widget kotak pencarian ini, namun mungkin kebanyakan justru malah jarang memberikan triknya atau mungkin memang tidak begitu penting. saya mendapatkan script ini dari forum luar negeri yang memang sudah sangat lama sekali. blogger Indonesia sendiri ada beberapa yang menggunakan widget search box google ini. untuk contoh widgetnya kalian dapat melihat pada bagian kanan blog jagoankode ini. Nah lalu bagaimanakah cara kerja dari widget kotak pencarian /search box google ini. mari kita simak ulasan singkatnya berikut ini.

Cara Kerja Widget Kotak Pencarian (Search BOX) Google

jika diperhatikan dengan seksama widget kotak pencarian bila diketik maka secara otomatis menampilkan query yang relevan terhadap keyword yang dimasukan dan ditampilkan langsung di blogger, nah untuk search box yang saya maksud ini jika kalian mengetik kata kunci atau keyword maka akan terbuka langsung pada panel google dengan menyertakan link situs yang kalian punya, jadi format pengetikan kata kunci search box google akan menjadi seperti ini :

Kata Kunci / Keyword Site : https://jagoankode.blogspot.com/

kalian bisa melihat screen shot perbedaan antara kotak pencarian default dengan kotak pencarian dari google.

Cara membuat search di web html

 sebenarnya jika diperhatikan keduanya terlihat sama namun terdapat sedikit perbedaan mengenai dimana postingan yang kalian cari ditampilkan, lalu apa fungsi memasang kotak pencarian google ini ?

Fungsi Dan Manfaat Memasang Kotak Pencarian (Search BOX) Yang Mengarah Ke Google

untuk fungsi dan manfaat sebenarnya tidak ada hal hal yang khusus hanya akan membuat kalian tampil agak sedikit berbeda saja dari blogger lainnya, selain itu jika kalian peain adsense tentunya akan semakin menguntungkan kalian, karna search box ini akan banyak mendata tayangan referer yang berasal dari google. selain itu juga meningkatkan popularitas artikel dimata search engine dengan catatan yang mencari postingan tersebut dalam jumlah besar.

oke setelah memahami fungsi menfaat dan kegunaan serta cara kerja kotak pencarian dari google ini maka kita akan melanjutkan ke langkah pembuatannya. untuk itu mari simak langkah lengkapnya berikut ini :

Cara Membuat/Memasang Kotak Pencarian (Search BOX) Yang Mengarah Ke Google

1. silahkan buka blogger kalian masing masing
2. Pergi kemenu tata letak/layout >> Tambahkan Gadget/Add GAdget>> HTML/Javascript
3. lalu pastekan kode dibawah ini

<style>
.search-input input, .search input {
width: 94.7%;
padding: 11px 0 12px 1em;
color: #333;
outline: none;
height: 20px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
}
</style>
<form action="https://www.google.com/search" id="searchform" method="get" target="_top">
<div class="search-input">
<input aria-label="Search this blog..." autocomplete="off" name="q" placeholder="Search this blog..." required="required" value="" />
<input name="as_sitesearch" type="hidden" value="https://jagoankode.blogspot.com/" />
</div>
</form>

4. Jangan Lupa simpan dan lihat hasilnya

Catatan :
ganti tulisan URL blog https://jagoankode.blogspot.com/ dengan yang kalian punya
placeholder=”Search this blog…” Ganti tulisan  Search this blog dengan teks yang kalian inginkan Silahkan berkreasi dengan css versi kalian

Demikianlah tutorial mengenai Membuat Kotak Pencarian (Search BOX) Yang Mengarah Ke Google semoga informasi ini dapat membantu kalian semua sekian dan terima kasih 😀

You may also like

About the author

Pengetahuan adalah kebebasan, dan ketidaktahuan adalah perbudakan.