SINO ENCUENTRA ALGO, USANDO ESTÉ BUSCADOR LO HARÁS

13 de julio de 2009

Agregando un Buscador al Blog


Los buscadores son una herramienta muy útil para hacerle mejor la experiencia de navegación por el blog a tus visitantes, ya que les facilita el encontrar la información que no ven o que ya no esta en la página principal.

Bueno estas son 3 formas de agregar un buscador en tu blog o sitio web.












  1. Buscador interno del blog:

    Se trata de colocar un simple caja de texto con un botón buscar, que al colocar los terminos a buscar esté ofrecera como resultado todos las entradas que tengan esas palabras.Esté es el código de buscador lo puedes colocar donde quieras, en el sidebar o en alguna entrada, presionado antes Edición de HTML, lo pegas y publicas.


    <form action="/search" method="get">
    <input id="search-box" name="q" type="text"/>
    <input id="search-btn" value="Buscar" type="submit"/>
    </form>


    Puedes mejorarlos agregándole algún estilo css. En esté código podrás notar que ya existen dos id's, search-box y search-btn, cada uno representa una condición css que puedes crearle los atributos que desees.

    Ejemplo de css:


    #search-box {width: 250px; border: 2px solid #ff5800;padding: 1px;}
    #search-btn {background: #fffff;color: #020202;padding: 1px;margin: 0px 0px 0px 3px;
    border: 2px solid #ff5800;}


    Resultado:





  2. Buscador de Blogs de Google:

    Se trata de colocar el buscador de blog de google en nuestro blog, pero que esté solo muestre los resultado de busqueda de él mismo. Para ello tienes que sustituir donde aparece ceamtm.blogspot.com, por la dirección de tu blog.

    Esté es del código del Buscador de Blog de Google:


    <form name="b-search" action="http://search.blogger.com/">
    <input id="search-box" type="text" id="b-query" name="as_q" /> <input id="search-btn" type="submit" value="Buscar" alt="Search This Blog" id="b-searchbtn" title="Search this blog with Google Blog Search" onclick="document.forms['b-search'].bl_url.value='ceamtm.blogspot.com'" />
    <input type="hidden" name="ie" value="UTF-8" /><input type="hidden" name="ui" value="blg" />
    <input type="hidden" name="bl_url" value="ceamtm.blogspot.com" /></form>


    Resultado: Aplicandole el mismo estilo css.




  3. Buscador de Google:

    La tecera opción es agregar el Buscador de Google pero que arroje los resultado solo de nuestro blog principalmente y de la web de forma secundaria, como al igual que los otros debes de pegar esté código donde quieras en tu sidebar, una entrada o en propio HTML.

    Código de Buscador de Google:

    <FORM method=GET action="http://www.google.com/search">
    <input type=hidden name=ie value=UTF-8><input type=hidden name=oe value=UTF-8>
    <input type=radio name=sitesearch value="http://ceamtm.blogspot.com" checked> El Blog <input type=hidden name=domains value="http://ceamtm.blogspot.com"> <input type=radio name=sitesearch value=""> La Web <INPUT id="search-box" TYPE=text name=q size=15 maxlength=255 value=""> <INPUT id="search-btn" type=submit name=btnG VALUE="Buscar"></FORM>


    Resultado: Aplicando el estilo css.

    El Blog La Web


No hay comentarios.:

Publicar un comentario

Para entendernos mejor:

* - Comentar sobre lo leido.
* - Colocar Nombre/URL, en el selector, sino se está registrado en Google, OpenID u otras de las opciones aquí mostradas.
* - No permitiremos insultos o inscitaciones a la violencia.
* - Lo que comentes es tú responsabilidad.
* - Los comentarios anónimos serán borrados, sino se adactan a las normativas, recomendamos usar Nombre/URL.

Nota a considerar:
* Los comentarios están siendo moderados.
* Contactanos a través de contacto, para cualquier sugerencia, duda o problematica, relacionada con el tema públicado.

Siguenos:
Sigue los post usando un lector de RSS - Twitter: @CeamTm - Facebook: WebCeam