Cara Buat Search Box atau Kotak Pencarian di Blog

Kotak Pencarian atau Search Box bisa disebut sebagai kebutuhan dasar dari sebuah blog. Dengan adanya kotak pencarian, pengunjung blog akan lebih mudah menemukan postingan atau artikel yang mereka cari atau butuhkan. Kalau sobat blogger sering melakukan Blog Walking dari satu blog ke blog yang lain, pasti sobat blogger tidak pernah menemukan blog yang tidak memiliki kotak pencarian, terkecuali blog baru. Search Box atau Kotak Pencarian yang saya siapkan ada tiga bentuk, setiap bentuk memiliki tampilan yang berbeda dan tampilan untuk setiap Search Box ini sangat sederhana.

Search Box 1
<br /> <form id="searchThis" action="/search" style="display:inline;" method="get"><input id="searchBox" name="q" type="text"/> <input id="searchButton" value="Click to go" type="submit"/></form>

Search Box 2
<br /> <form id="searchthis" action="/search" style="display:inline;" method="get"><input id="search-box" name="q" size="25" type="text" style="background: #ffffff; border: 2px solid #cccccc"/><input id="search-btn" value="Search" type="submit" style="background: #cccccc; border: 2px outset #cccccc; color: #000000; font-weight: bold;"/></form>

Search Box 3
<br /> <form id="searchthis" action="/search" style="display:inline;" method="get"><input id="search-box" name="q" size="25" type="text" value="Enter search query"/><input id="search-btn" value="Search" type="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBlZOQ-db_mjbNy0-UX9EL7VRR70ptuCub3WLyhC1WFZA5s7-h_mqUnZvi0vPnLXyqkYVGUEpDSRe3Nxy87Qe7le6qW3QI6Q9w7YO488JIPu-gfmZxm8m5ntNvcoKoh3jdavTVSZGUN3U/s1600/magnifier.png" style="margin-left: 5px; margin: 3px 0 0 5px;"/></form>

Search Box di atas bisa sobat blogger letakkan di kolom widget atau gadget.

Baca tutorial menarik lainnya di bawah ini :

Widget Blog

• Recent Post Widget No Thumbnail
• Membuat Google Translate Bendera Berbayang
• Cara Membuat Salam Pembuka Blog
• Cara Buat Tulisan Berjalan / Effect Marquee di Blog
• Cara Memasang Facebook Like Badge
• Membuat Google Translate Sederhana Untuk Blog
• Kelopak Bunga Berguguran pada Blog
• Cara Memasang Burung Twitter Terbang
• Cara Buat Widget Berlangganan FeedBurner
• Menghitung Jumlah Kata/Karakter Teks
• Cara Membuat Recent Post Animasi
• Cara Buat Daftar Isi
• Cara Pasang Alexa Traffic Widget
• Menghubungkan Blog Dengan Halaman Google +
• Membuat Google Translate Pin Bendera
• Social Bookmarking Widget Yang Keren dan Terbaru
• Cara Membuat Related Post / Artikel Berada di Sidebar
• Siapa dan Dari Mana Pengunjung Blog sobat?
• Cara Memasang Floating Spoiler Menu di Blog
• Cara Memasang Hewan Piaraan di Blog
• Cara Memasang Widget Kalkulator Cinta di Blog
• Widget Follower Jejaring Sosial Keren
• Cara Pasang Widget Al-Qur'an pada Blog
• Membuat Google Translate Bendera Bergerak