- Login to Blogger Dashboard -> Design tab -> Page Elements .
- Click on Add a Gadget where you wish to place Search Box.
- Choose HTML/JavaScript from the List.
- Place any one Search Box code in to it and Save the Gadget.
Style 1
<style type="text/css">#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpYXJDh9cFv1C9qNv7ZzcB9I07fVj9oblfeMSoFpaZ3J2ywFLr21oPPyF3JwEEBbsXI6NtaAk4GA87sRBdrUXg2QW3i5Opub-UuctXmP28AaN_am850X2nyFG4hWx5yKlc_xXIe4wR6tgO/) 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 2
<style type="text/css">#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA8POdnaEBuiLjT2VJXlhBwMgWcs5RBYZ8pHSFRpkFtA8ZD6vn4H8fonF0TkZeKkyj8b4SRdtu5skAR7qUWVdZdFAzSZwDCkX_zf4auVmb6wfBtEhD4jsqq8sv7osEJ1kITuKCaXBWW4NM/) 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 3
<style type="text/css">#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPdlzg1jGbNAYtxeiBO1ftqisy-nFmF4mJDY6mhRp0zBWMidzVJFdvDXX7Iy1yYFBdX3ecVHQxu_-Eu-ycD_yd5k24Xl_ZyOSTD7Gzxx2RARKzTagd61FH_ddzIhLMZ32eWCtXTanH602I/) 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 4
<style type="text/css">#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2fExIJeXMTNRvJO5Jo2JM5EYdTKNwrhyphenhypheniJtGWWyb4c9JmdG1zkbeuR8PklRBGWEER0lgOZTg3V8oxbYrOGAgC4yHyYxmDeGumEID8b__w_0j5t0jYxjIfrNzBphJ28SEWs2GHadufFvWN/) 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 5
<style type="text/css">#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjihPuEhXCVyZPczHWivB-_0XXg36KBYZQM33gD__EHIVZ7gIl4X7WFh2bbqAkiR5wrq2ZYCL9EcBOSnhyb_ru4qvaj_sZDJ0tJLcIYCw01xqyZBrwF5atEzsDZ00i6zG6NfPz0QpaOMZ45/) 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 6
<style type="text/css">#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfGLa1GPcPpMHOQqY04jJDHCnWZOWME4Mmm6FNX4Pmbr0MJcraJfDqljCCRAqquS-1k1vLWqFVXyBg87Xrj43kA5H6t_i-jhFCBOmCrFUITBnTt2z18n5SwJixLKKH5SKxfbt031WHgMty/) 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>
Your all Done....
