6 jun 2015

Cómo añadir un buscador a tu web y presentar el cuadro mejorado de búsqueda del sitio en los resultados de Google.

Todos los sitios web y Blogs precisan de un componente que sirva para buscar información por todo su contenido.

Los usuarios normalmente precisan encontrar información dentro de un sitio web. Muchas veces, cuando han encontrado lo que quieren en un determinado lugar, prefieren buscar dentro de él para encontrar más datos dentro de la web que visitan.

Gracias al uso de un buscador, los usuarios que visitan un determinado sitio web, podrán pasar más tiempo en él, disminuyendo el porcentaje de rebote o de salida.

Sin lugar a dudas, se trata de un añadido imprescindible en cualquier sitio web o Blog donde se le desea dar acceso al usuario a toda la información almacenada en el mismo.

Además vamos a utilizar unos tipos de buscadores web que benefician especialmente la localización de información: los buscadores en los resultados de búsqueda de Google. No pierdas detalle de la guía paso a paso y escoge tu tipo de buscador preferido.


¿Qué es un buscador interno?

Se trata de un componente que realiza búsquedas de información dentro del sitio web donde reside. 

¿Qué beneficios tiene utilizar un buscador interno?


Los buscadores internos de una web son beneficiosos para el usuario y para el creador del sitio:

  • Para el usuario que visita la web es beneficioso porque facilita la posibilidad de localizar lo que busca sin salir del sitio que está visitando. 
  • Para el creador del sitio es beneficioso porque los usuarios pasan más tiempo en el sitio web visitado, realizando las búsquedas de aquello que les interesa.

¿Qué tipos de buscador interno puedo poner en una web?

Existen múltiples maneras de implementar un buscador interno en una web, pero hay algunos formatos especialmente enriquecedores porque añaden funcionalidad al buscador general de Google, veamos todos los tipos disponibles.
  • Buscador estándar: 
Es el clásico que puede añadirse automáticamente a cualquier sitio web, tanto en Blogger, como en WordPress, Joomla o cualquier sistema de publicación que utilices.

  • Buscador personalizado de Google: 
Es con diferencia el tipo de buscador más potente que puedes incluir en una web. Dispone de múltiples funcionalidades especiales que te permiten configurar desde el ámbito de la búsqueda dentro de tu web como la personalización del aspecto que mejor encaje con tu sitio web.

    ¿Qué es el cuadro mejorado de búsqueda del sitio que aparece en los resultados de Google?

    Se trata de un cuadro de búsqueda especial que aparece en los resultados de búsqueda de Google en función de las decisiones que toma el algoritmo de búsqueda de Google con respecto a la búsqueda que introdujo el usuario y el sitio web que aparece listado en dichos resultados.

    Si se implementa un buscador en un sitio web, con un código específico que a continuación explicaré en la guía, Google puede mostrar en los resultados de búsqueda el cuadro de búsqueda del sitio.

    ¿Cómo tener la posibilidad de obtener un cuadro de búsqueda del sitio mejorado en los resultados de Google?

    El cuadro de búsqueda del sitio en los resultados de búsqueda de Google es ideal para que el usuario pueda directamente refinar la búsqueda de lo que desea al acceder al sitio. Google nos explica su implementación aquí.

    Normalmente, este tipo de cajas de búsqueda especiales sólo se activa en sitios web que cumplen con una serie de características especiales:

    • Deben tener una implementación en código determinada que facilite a los robots rastreadores de Google su identificación y reaprovechamiento de los resultados de búsqueda.
    • Su muestra o no en los resultados de búsqueda de un sitio web depende totalmente de los algoritmos de búsqueda de Google. Es decir, no basta con que se implemente el código del buscador de una determinada manera, además Google decidirá si aplica esta manera de mostrar los resultados de una web en su buscador o no.
    Normalmente, esta clase de buscadores especiales, se activan para sitios web con mucho tráfico de búsqueda y visitas, además no siempre, depende de los algoritmos del buscador de Google.

    ¿Cómo añado un buscador en mi web que pueda llegar a presentar un cuadro de búsqueda del sitio mejorado de Google?

    1) Selecciona el tipo de buscador que deseas utilizar:
    Lo primero, escoge el tipo de cuadro de búsqueda que vas a utilizar en tu web:
    A) Poner un Cuadro de búsqueda personalizada de Google:
     Es la opción más recomendable, por su potencia, facilidad de uso y versatilidad. Aquí tienes un ejemplo totalmente funcional para que lo pruebes.
    Si quieres aprender a utilizarlo realiza la siguiente guía paso a paso: Cómo poner un motor de búsqueda personalizada de Google en mi web 
    B) Poner Cuadro de búsqueda estándar:
    Es el cuadro de búsqueda típico en la mayoría de sitios web, mucho más limitado que el buscador personalizado de Google pero suficientemente versátil. Aquí te dejo un ejemplo totalmente interactivo para que lo pruebes.


    Simplemente debes añadir el siguiente código fuente al gadget, widget o componente HTML de tu sitio web para que te aparezca el buscador estándar:
    <form id="buscador" action="/search" style="display:inline;" method="get">
    <input id="caja_de_busqueda" name="q" placeholder="Introduce tu búsqueda..." />
    <input id="boton_de_buscar" value="Buscar" type="submit" /></form>
    Por ejemplo en Blogger, bastaría con añadir  un "gadget HTML/Javascript" y copiar y pegar el código fuente que te he puesto antes. 
    2) Añade el código de fuente para activar el cuadro de búsqueda mejorado de Google en los resultados de búsqueda:
    A continuación, añade el siguiente script a tu sitio web. Lo puedes poner en cualquier parte del <body> del código HTML:
    <script type="application/ld+json">
    {
       "@context": "http://schema.org",
       "@type": "WebSite",
       "url": "http://
    direccion_de_tu_web/",
       "potentialAction": {
         "@type": "SearchAction",
         "target": "http://
    direccion_de_tu_web/search?q={search_term_string}",
         "query-input": "required name=search_term_string"
       }
    }
    </script>
    3) Comprueba el uso de la URL canónica: 
    Puedes seguir en esta guía el punto 2) referente al uso de la URL canónica. En Blogger y la mayor parte de sistemas de publicación web, el marcado de URL canónica es automático.
    NOTA IMPORTANTE: No es instantánea la aparición del cuadro mejorado de búsqueda en los resultados de Google para tu web. Tarda un tiempo en aparecer y además está sujeto a la decisión de los algoritmos de Google.

    ¡Eso es todo!, cualquier duda me tienes en los comentarios.



    Escrito por Miguel García Sánchez - Colomer

    Dispuesto a ayudarte con tu Blog en todo lo posible, Diarios de la nube es mi medio para llegar hasta ti. El conocimiento es universal, es del mundo, es de todos, esta es mi parte y la comparto contigo.

    26comentarios:

    1. Ya que me lo has recordado, lo probaremos ;)

      ResponderEliminar
      Respuestas
      1. ¡Hombre!, un placer verte por aquí. Está muy bien este buscador, yo el que sale en Google no lo puedo recibir. La mejor manera es como lo tengo hecho (igual que seomoz, 20minutos y todas), te pones el personalizado, lo llamas desde tu buscador normal a otra página y en la URL del json pones la URL de la página donde vayas a poner el buscador. Con eso, la URL canónica bien y tal, optas al buscador en google. Por otro lado, el personalizado es muy potente.

        Ya me contarás qué tal te queda el invento.

        Abrazos.

        Eliminar
    2. Miguel, muchas gracias por el artículo. Una consulta: ¿La página de resultados de búsqueda de tu sitio debe cumplir algún requisito específico?

      Saludos!

      ResponderEliminar
      Respuestas
      1. Ninguno en concreto, sólo intenta que funcione bien en móvil además de en ordenador. Procura que sea lo más "usable" en cualquier dispositivo posible.

        Cualquier duda aquí estoy.

        Eliminar
    3. soy nuevo en HTML y me gustaría saber, ya puse este código, ahora mi duda es como puedo yo programarla para que encuentre lo que le pido, por ejemplo estoy haciendo mis practicas y me pidieron una pagina web de ventas de muebles de oficina ahora como puedo yo buscar por ejemplo "escritorios" y que tire resultados??

      ResponderEliminar
      Respuestas
      1. pues yo también soy nuevo en esto, pero por lo que entiendo este buscador interno solo buscara las palabras que tu le pongas como dices "escritorio" te tira solo resultados con ese nombre, pero mejor si Miguel García nos puede aclarar esa duda

        Eliminar
      2. En esta guía tienes dos formas de poner un cuadro de búsqueda. Búsqueda personalizada de Google o búsqueda directa programada por ti. Una vez puesto el código que necesites, sólo tienes que escribir la palabra que quieres buscar en el cuadro de búsqueda del buscador y arrojará los resultados automáticamente. Tratarán ambos métodos de buscar entradas en tu web que contengan "escritorios" o similares.

        Un saludo

        Eliminar
    4. gracias por el gran aporte para los que iniciamos en esto, como estoy aprendiendo también, yo quisiera saber como pongo un buscador interno pero aun no e subido mi pagina web asi que el archivo esta guardado como HTML en "bloc de notas", asi que aparte de no entender mucho de HTML "aun" quisiera saber como puedo implementar esto a la pagina, almeno por el momento mientras subo esta a la red y cambie la dirección. Gracias por tu comprensión

      ResponderEliminar
      Respuestas
      1. Simplemente añade un Widget en tu Blog y copia y pega dentro de ese widget el código que sirve para que se dibuje el buscador. Con eso comenzarás a tener activo.

        Un saludo.

        Eliminar
    5. Buen articulo muy necesario, una pregunta... Me gustaria poner un buscador para mi sitio web pero que busque internamente algo de mi pagina como tal no seria un buscado de google si no uno totalmente interno. gracias.

      ResponderEliminar
    6. Hola amigo ami tambien me interesa mucho poder agregar buscador estandar que pones, solo que soy nuevo en esto, y me gustaria saber si me puedes apoyar para poder saber que mas configuracion necesito agregar para que me arrogue los resultados de mi sitio. como enlazar cada una de mis paginas y el codigo java, etc.
      saludos

      ResponderEliminar
      Respuestas
      1. Esta guíav le sirve bien para lo que necesita. En los buscadores de esta web puede poner buscador y le aparecerán otras guías. Pruebe a hacer una y voy resolviendo las dudas que tenga.

        Un saludo y muchas gracias.

        Eliminar
    7. Puse el codigo y no me busca, como me pueden ayudar? mi web es www.salimoos.com

      ResponderEliminar
    8. No me funciona el codigo del buscador.

      ResponderEliminar
      Respuestas
      1. Hola, es el mismo código que yo utilizo. ¿Qué es lo que no te funciona?.

        Eliminar
    9. con todo respeto, no crees que hay que actualizar este codigo, es que no me sirve y otros que encuentro solo tienen estructura similares pero si funcionan pero me gusta mas la simplicidad de este por favor arreglalo

      ResponderEliminar
      Respuestas
      1. Hola, es el mismo código que yo utilizo y el que se emplea en el ejemplo, que es totalmente funcional. Si me dices la web miro a ver cuál es el problema "in situ".

        Un saludo.

        Eliminar
    10. tengo una duda, este buscador aun que sea con ayuda de google nos mostrara en nuestra pagina web solo los resultados de nuestra pagina,por ejemplo yo estoy creando un sitio de ventas y compres como olx pero es para un colegio, y aun no lo e subido, pero en fin; ¿hasta que suba mi pagina este buscador funcionara? ¿y como hago que mi buscador muestre solo resultados de mi pagina osea lo programo aparte o (aun que suene perezoso jeje) ya solo lo tienes para copiar y pegar y listo ? perdon si es largo pero asi me quedo sin dudas. Saludos miguel

      ResponderEliminar
      Respuestas
      1. Cuando configuras el propio buscador personalizado de Google, podrás decirle que sólo busque dentro del sitio web en el que estás aplicándolo. Recuerda subir el sitemap y seguir las indicaciones de la guía, verás que es capaz de buscar exclusivamente dentro de tu propia web.

        Cualquier duda aquí estoy.

        Un saludo.

        Eliminar
    11. Hola Amigo Tengo Un Problema Al Buscar En Mi Web No Escuentra Ningun Resultados Por Ejemplo Al Buscar Imagenes,Ya Le Puse Nombres Y Etiquetas Al Las Imagenes Pero Aun Asi No Aparece Nada,Me Podrias Decir Cual Es Mi Problema?

      ResponderEliminar
      Respuestas
      1. Es para buscar textos, no lo he probado para buscar imágenes. Debería de funcionar normal si pruebas con textos.

        Para esa clase de buscador, te recomiendo: http://www.diariosdelanube.com/2014/06/como-poner-un-motor-de-busqueda.html

        Un saludo!

        Eliminar
    12. oye ami no se si sirve o no porque yo lo pegué en mi pagina web muestra la pagina de resultados pero no sale nada :v o ise algo mal :'v

      ResponderEliminar
    13. Buenos días, excelente tutorial, pero tengo un problema ya hice todo, pero me dice que "The requested URL /search was not found on this server." esta URL donde la pongo o como hago para que me redireccione allí. Gracias.

      ResponderEliminar
    14. Se puede agregar un buscador interno para una página web?, considerando que es para la escuela y que posiblemente solo la usen pocas personas

      ResponderEliminar
    15. El buscador personalizado de Google ¿Busca también en páginas o solo en entradas? Si solo busca en entradas ¿cómo hacer un buscador que encuentre páginas también?

      ResponderEliminar

     

    © 2015 Por: Miguel García Sánchez - Colomer en Diarios de la nube Todos los derechos reservados.