Cara Menciptakan Box Pencarian Blogger (3 Kotak Dan Demo)

Widget Gadget kotak pencarian blog sangat diharapkan untuk Blogger sebagai Pembaca sanggup pribadi mencari kata kuncinya yang ada di halaman blog.

Meskipun Blogger menyediakan widget kotak pencarian blog secara default. Tapi kebanyakan seorang Blogger mengganti kotak pencarian blog dengan yang lebih menarik lagi.

Saya di tutorial kali ini membagikan beberapa script isyarat widget kotak pencarian yang lebih keren dengan warna yang menarik, sobat bebas untuk mengcopy paste untuk memilihnya.

Manfaat memasang kotak search engine di halaman Blog Blogger:
Meskipun bermanfaat bagi pembaca. pembaca sanggup mencari posting tertentu dari posting Anda dalam waktu cepat. Dan juga mempunyai kegunaan untuk Blogger alasannya yakni mereka sanggup dengan cepat mencari posting di sana dan sanggup menggunakannya dikala mereka membutuhkannya.

Berikut script kodenya dan demonya ;

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisGYMy06m51u0V1yZ4Qojrf3iavPjL6OufeEqbRrL3W6H0qEZxwlIac5vUl4Sm9yl2C5SC7UcPhxLw-a8HuujvvMLWz8CGrHo1ZnaWXo-vAbzi-7teSeqChoYTR984Cow22Q1_xGu77ssH/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
<form id="w2b-searchform" action="/search" method="get">
    <input type="text" id="s" name="q" value=""/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU1dSfO8uQSI_lorrM6XXgOcvyMz3h_jv-amhwv55HKezSnChuVhU_Q3X6dvxJNiV6ZtC4nvrW7phBD_fl_EP0446kLlIUBMWnlRuW08S7FLVThrV12Iuyu5eLDgSg7kjOzyFaT9sOQjI0/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
<form id="w2b-searchform" action="/search" method="get">
    <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXBxVHQuO02_H20sdrLGfVALpHj4W6ZjmwNnkv45v2UDsQwf8c9-o58Ozkk8W8BD9Faj37pvE0VnpNhwOkLToOH9XgG1Df7jcjWuLs8-GwU-FTrk9jwgdJYV_gMNaZ9Y4ushb2YvjOr5bC/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
<form id="w2b-searchform" action="/search" method="get">
    <input type="text" id="s" name="q" value=""/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

Cara menambahkan kotak pencarian di blog:

Buka akun blogger anda.
Klik pada tata letak.
pilih tambahkan gadget.
Klik pada menambahkan html / javascript.
Pilih isyarat script kotak pencarian Blogger yang saya bagikan.
Setelah itu, Klik simpan.

Cukup sekian biar bermanfaat untuk para sahabat blogger lainnya, jikalau menemukan kesalahan atau tidak muncul di halaman post tanyakan pribadi ke kotak komentar di bawah ya sob.