Buscador personalizado blogger

Este truco sirve para poner un buscador personalizado en tu barra lateral como gadget, puedes personalizar los colores a tu gusto.

Pasos:

1. Tienes que ir a tu panel de Blogger y darle click en "Añadir un gadget"

2. Añade un gadget tipo "HTML/Javascript"

3. Pega el siguiente código

<style> 
#search-btn { 
background-color:#A9D0F5; 
color:#FFFFFF; 
margin:0; 
font:bold 16px Arial; 
border:0; 
} 
#search-btn:hover { 
cursor:pointer; 
background-color:#2E9AFE; 
} 
#search-box { 
color:#2E9AFE; 
margin:0; 
font:bold 16px Arial; 
border:1px solid #CEE3F6; 
width:150px; 
} 
</style> 
<form id="searchthis" action="/search" style="display:inline;" method="get"> 
<input id="search-box" name="q" type="text"/> 
<input id="search-btn" value="Buscar" type="submit"/> 
</form>

El buscador se vera así:









4. Para personalizar los colores



#search-btn {



background-color:#A9D0F5; este es el color del fondo del botón



color:#FFFFFF; este es el color del texto del botón



margin:0;



font:bold 16px Arial;



border:0;



}



#search-btn:hover {



cursor:pointer;



background-color:#2E9AFE; color de fondo del botón al estar el mouse encima



}



#search-box {



color:#2E9AFE; color de las letras del área de texto



margin:0;



font:bold 16px Arial;



border:1px solid #CEE3F6; color del borde del área de texto



width:150px; ancho del área de texto



}