Buscador personalizado

Para poner un buscador personalizable en su blog solo deben pegar un simple código,este truco sirve para que lo puedan poner en su barra lateral como gadget,puedes personalizarlo a tu gusto veamos como con este Tutorial de 2 pasos:

1. En un elemento javascript pega este 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>

bien ya tienes tu buscador listo se vería así:

2. PERSONALIZACÍÓN:

#search-btn {
background-color:#A9D0F5; este es el color del fondo del boton
color:#FFFFFF; este es el color del texto del boton
margin:0;
font:bold 16px Arial;
border:0;
}
#search-btn:hover {
cursor:pointer;
background-color:#2E9AFE; color de fondo del boton al estar el mouse encima
}
#search-box {
color:#2E9AFE; color de las letras del area de texto
margin:0;
font:bold 16px Arial;
border:1px solid #CEE3F6; color del borde del area de texto
width:150px; ancho del area de texto
}