Cute buscador en tu blog!

Aclaración:

Este tutorial, es original de MMC & puedo asegurar nunca antes haberlo publicado, ni prestado.
Vi que fue tomado & utilizado, sin sus créditos correspondientes & sin previo aviso.
Debo concluir, que fue revisado el código fuente de MMC para extraer el código & cada quien sabe de sus actos cometidos.
Por este motivo, desactivare el click derecho del mouse, & en cuanto me organice & pueda comenzar a colocar los códigos fuera del blog, también serán desactivadas las teclas del teclado.
Lamento llegar a estas circunstancias, pero ya no tengo tanto tiempo como antes & no puedo estar pendiente de quien toma algo sin permiso o no, mucho menos si no lo compartí, eso fue lo que me molesto.

Question:

Y tenía una duda u_u podrías hacer un tutorial para poner el buscador que tienes en el blog? Es que está muy bonito Besos.

RESPUESTA: Con gusto, tenia pensado subirlo, pero no encontraba momento, tenia que despejar varias dudas antes! (ﾉ´∀｀*)ﾉ

Tutorial:

Colocarlo es mas que simple:
Vamos a Diseño / Añadir un gadget / HTML/javascript & allí pegas el siguiente código & edita lo marcado:

<style>
#MMCcut {
background: #f0f0f0; /* FONDO DEL RECUADRO */
padding: 7px;
width: 200px; /* ANCHO DEL BUSCADOR */
height: 57px;
border: 1px dashed #ccc; /* BORDE DEL RECUADRO */
}
#MMCcut input.field {
font-family: Arial;
color: #aaa;
font-size: 9px;
text-transform: uppercase;
width: 200px;
border: 1px solid #ddd;
z-index: 1;
height: 25px;
padding-left:20px;
background: #fff url(URL GIF DERECHO) no-repeat 96% 50%;
}
#MMCcut input.field:focus {
background: #fff url(URL GIF DERECHO HOVER) no-repeat 96% 50%;
}
#MMCcut input.submit {
width:190px; /* ANCHO DEL BOTON BUSCAR */
height:25px;  /* ALTO DEL BOTON */
font-weight: normal;
border: 1px solid #e0e0e0; /* BORDE DEL BOTÓN */
box-shadow: 1px 2px 0px #aaa; /* SOMBRA DEL BOTON */
font-family: Arial;
font-size: 9px;
text-transform: uppercase;
margin-top:3px;
background:#fff; /* FONDO DEL BOTON BUSCAR */
color:#000; /* COLOR DE LETRA DEL BOTON */
border-radius: 222px;
}
#MMCcut input.submit:active {
box-shadow: -1px -1px 0px #ccc; /* SOMBRA DEL BOTON ACTIVO*/
border: 1px solid #eee; /* BORDE DEL BOTON ACTIVO */
color: #999; /* COLOR DEL TEXTO BOTON ACTIVO */
}
</style>

<center>
<div id='MMCcut'>
<form action="/search" id='searchform' method="get">
<input class='field' name='q' type='text' value='TEXTO DEL RECUADRO PARA ESCRIBIR'/>
<input class='submit' type='submit' value='TEXTO DEL BOTON BUSCAR'/>
</form>
</div>
</center>

NOTA:

Como dice el titulo, "Buscador Cute", les traigo un buscador ya editado, para que solo coloquen el código en un gadget HTML/javascript & listo!

C O D E :

<style>
body {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk_LKLjdiCqbhKpmW7HkBkK7s8AM-6TYcHqF1h0lFfbbbFHsnBb5XalHyxQjQiVYll2DFtSQfd_65NSU_EJWTxSFfknB-_eLzvYiWUfSk_9io5OThGB8r8KB8nFkzojBa35AQCNkkewYs/s1600/white_brick_wall.png);}
#MMCcut {background: #f0f0f0; padding: 7px; width: 200px; height: 57px; border: 1px dashed #ccc;}
#MMCcut input.field {font-family: Arial; color: #aaa; font-size: 9px; text-transform: uppercase; width: 200px; border: 1px solid #ddd; z-index: 1; height: 25px; padding-left:20px; background: #fff url(http://i122.photobucket.com/albums/o260/mhilka/minigifs/balaozinho22.gif) no-repeat 96% 50%;}
#MMCcut input.field:focus {background: #fff url(http://i122.photobucket.com/albums/o260/mhilka/minigifs/visitando.gif) no-repeat 96% 50%;}
#MMCcut input.submit {width:190px; height:25px; font-weight: normal; border: 1px solid #e0e0e0; box-shadow: 1px 2px 0px #ff99b2; font-family: Arial; font-size: 9px; text-transform: uppercase; margin-top:3px; background:#fff; color:#ff99b2; border-radius: 222px;}
#MMCcut input.submit:active {box-shadow: -1px -1px 0px #ccc; border: 1px solid #eee; color: #ccc;}
</style>
<br><br><BR>
<center>
<div id='MMCcut'>
<form action="/search" id='searchform' method="get">
<input class='field' name='q' type='text' value='Busca aqui!'/>
<input class='submit' type='submit' value='Buscar'/>
</form>
</div>
</center>

Espero les sea de utilidad!

Nos vemos en la próxima entrada ヾ(＾∇＾)♥