Mil Trucos Blogger

Buscador Interno estilo Google

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Seguro que muchos de ustedes han visto que con el nuevo diseño de Google su buscador tambien ha cambiado de diseño y algunos han quedado fascinados con dicho diseño y han querido agregarlo en sus blogs de Blogger, pues bien hoy les enseñare como agregar un buscador interno con el estilo del buscador de Google.


Para agregar este truco primero debes agregar los estilos arriba de ]]></b:skin> :

/* Boton y borde del buscador */
#search-btn {
width:70px;
height: 31px;
background: url(http://2.bp.blogspot.com/-OlTpcdxjBDY/TjNnoH0sMJI/AAAAAAAAAH0/4P2_gkqd-9Y/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 */

Ahora solo queda añadir el cuerpo del buscador y esto lo haces pegando en un Elemento HTML/JavaScript lo siguiente:

<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.

Via/CoquitoBlogger

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

8 Comentarios

  1. Anonymous Anonymous
    Octubre 20, 2012    

    Excelente, tengo una idea sabes como colocar unas flechas
    una en la lado izquierdo y la otra en el derecho
    para pasar de una entrada a otra como los sitio web modernos

  2. Octubre 22, 2012    

    buscador interno o con CSE? prefiero el interno y bloquear los parametros de las URLs

    • Octubre 23, 2012    

      Amigo este es un buscador interno :LOL:

  3. Noviembre 12, 2012    

    Pues mi estimado a pesar de tener ya un buscador en mi blog, me parece interesante este buscador con un codigo distinto al mio.

  4. Febrero 19, 2013    

    esta genial 😎

  5. Marzo 2, 2013    

    Perdona, no he entendido nada, donde se supone que debo pegar los datos?

    • Marzo 2, 2013    

      Debes pegar el código en Diseño, Añadir gadget, HTML/Javascript

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo