Cara Memasang Search Engine di blog

Widget search box ini bisa anda pasang untuk Blogger / blogspot dan juga wordpress. saya akan sharing untuk blogger saja yah! maklum lagi males buka wordpress :p. Berikut ini cara memasang widget search box di blogger/blogspot. saya mengambilnya dari www.bamz.us

Cara memasang widget search box di blogger

Login ke Blogger > Edit HTML > Add Element baru > HTML atau Javascript
Copy salah satu kode dari 6 widget serch box keren di bawah ini dan paste pada element baru tadi.

Widget Search box 1

 <style type="text/css"> #a-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif54_uBBvgIm4zqUWWwRQUprhUJC2wiW5dR5aDWe-hj5LX70XfqNGYCq-eZ8xYmpm6jV_MLlGjhqHxHqGSxZuQltCpYddUsxeSHNw-IrmZx68PMfMmsmdF-haMqBioEftK4VYzC52vynnj/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#a-searchform{display: block;padding: 10px 12px;margin:0;} form#a-searchform #a{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#a-searchform #abutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="a-searchbox"><form id="a-searchform" action="/search" method="get"><input type="text" id="a" 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="abutton" /> </form></div>

 

Widget Search box 2

 

  <style type="text/css"> #b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4zASuJzll2sLFuWI1MFUz0xNJvcfrseXiprJZMgaSsiNE8oirtw1jXZECBvWVEHY_az9Sl6FCcfoc66mRtcsw6rwA7Gqd95gwmP76taQGjpqOlklLD6xu021ZzBh0FvvbaYxw-SvnNTOT/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#b-searchform{display: block;padding: 10px 12px;margin:0;} form#b-searchform #b{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#b-searchform #bbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style> <div id="b-searchbox"><form id="b-searchform" action="/search" method="get"><input type="text" id="b" 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="bbutton" /></form></div>

 

Widget Search box 3

 

  <style type="text/css"> #c-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmAGa4dZ08qGOceoKlDPytA2scIzAg-pUKQlO4i9bvFlkm9sCp6NDVbd1hUW49rsM68iMthCuXP_jrX4wCx3Fz82b8yioSh-cZwm4yYxiNsa9RDmbduSvPiWze2FHRfiVggIoM3BaArmR4/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#c-searchform{display: block;padding: 10px 12px;margin:0;} form#c-searchform #c{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#c-searchform #cbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;} </style><div id="c-searchbox"><form id="c-searchform" action="/search" method="get"><input type="text" id="c" 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="cbutton" /></form></div>

 

Widget Search box 4

 

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

 

Widget Search box 5

 

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

Widget Search box 6

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

 

 

Sekian Postingan kali ini semoga bermanfaat