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!