Buscador Interno estilo Google

En esta oportunidad comparto con ustedes un buscador interno para el blog al estilo de Google, jugando un poco con los estilos css, el resultado es el de la imagen, espero que les guste.

Si te gusto este Buscador, lo puedes usar en tu blog de la siguiente manera.

1.- Vamos a Diseño>Edición de HTML tecleamos Ctrl+F y buscamos ]]></b:skin> y sobre ella pegamos lo siguiente:

/* Boton y borde del buscador */
#search-btn {
width:70px;
height: 31px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHJyy8cj4e66ZI1KCbjcytfV3pUR9hIQWzVndEl1cwVuoe2cQZXx1K07V23m7bpmbjzV3blpZgJ8I9ixO0nZmwlwPzGpCz0J6bMsBMXNg1sOD60Par-AAgPifueqVbo7TvfKiGewI6ZHQ/s1600/ico-search.png) no-repeat #4d90fe center;
font-size:0;
padding: 1px;
margin: 0px 0px 0px 12px;
border: 1px solid #3079ED;
}

#search-box {
float:left;
width:300px;
height:27px;
line-height:27px;
text-indent:10px;
font-family:arial, sans-serif;
font-size:1em;
color:#333;
background: #fff;
border:solid 1px #d9d9d9;
}
/* Fin del codigo */

2.- Guardamos plantilla, nos vamos a Diseño>Añadir un Gadget>HTML/Javascript y allí pegamos el siguiente código:

<form action='/search' id='searchthis' method='get' style='display:inline;'><input id='search-box' name='q' type='text'/><input id='search-btn' type='submit' value=''/></form>

Con width:300px; puedes ajustar el ancho del buscador de acuerdo a tu blog, si seguiste bien los pasos el resultado sera como la imagen, Suerte!