El rincón de JMACOE

Búsqueda sencilla para tu sitio web

Acaso no quieres tener una entrada de búsqueda funcional que se parece a esta:

Con el siguiente código lo puedes conseguir:

<form action="http://google.com/search" method="get">
  <div>
    <input type="search" name="q" placeholder="Search" results="0" />
    <input type="hidden" name="q" value="site:blog.jmacoe.com" />
  </div>
</form>

El código anterior se apoya en una serie de hechos poco conocidos acerca de formularios HTML y de Google:

  1. He utilizado dos elementos de entrada para la construcción de la consulta de Google. Uno de ellos es una entrada de búsqueda HTML5 y el otro es un elemento de entrada oculto. Pero aquí viene lo bueno: los dos utilizan el mismo nombre – en este caso, q. Esto producirá una cadena de consulta que se parece a esto: q=test&q=…. Ten en cuenta la presencia de dos parámetros q. Google combina ambos parámetros para crear la consulta de búsqueda completa.
  2. El elemento de entrada oculto tiene el valor de site:blog.jmacoe.com la cual se añade al final de la cadena de búsqueda normal. Google lo utiliza para limitar la búsqueda a un sitio web determinado.
  3. Para que el formulario sea enviado a Google, he establecido el atributo «action» en el formulario hacia http://google.com/search. El atributo «action» puede ser una URL completa a otro sitio. No tiene por qué referirse a una URL en tu propio sitio.

Comparte y diviertete: