NorfiPC » Diseño Web Crear formularios búsquedas

Como crear formularios web para buscar información en internet

Códigos para insertar cuadros de búsquedas en las páginas web, con diferentes opciones y criterios, que permitan buscar de forma personalizada información y datos en internet. Crear tu propio buscador en una página en el equipo local. Como resaltar los resultados y los términos de búsquedas.

Crear formularios web para buscar en internet

Internet es una especie de mundo virtual lleno de millones de páginas web que contienen información y datos de todo tipo.
La única opción de encontrar lo que necesitamos, es utilizar los buscadores web, programas que acceden a enormes bases de datos con información indexada a lo largo de años de escaneo en la red.
El único problema radica en que es tanta la información existente, que en ocasiones podemos pasar horas haciendo peticiones sin quedar satisfechos.
Como cada usuario tiene propósitos, gustos e intereses diferentes, la mejor opción puede ser crear tu propio formulario de búsqueda, o varios de ellos con opciones que permitan realizar búsquedas personalizadas usando las bases de datos de buscadores diferentes.

Crear un cuadro de búsqueda en una página web local

Crear nuestro propio formulario de búsquedas algo sencillo y no requiere de ningún conocimiento avanzado, solo copiar y pegar y un poco de lógica.
No es necesario tener una página web ni un blog, puede crearse una sencilla página web que funcione de forma local en el equipo, con distintos formularios y desde ella hacer tus búsquedas en internet.
Si tienes algún conocimiento de HTML salta dos o tres párrafos, si no continua leyendo.

Plantilla para crear una página web con un formulario elemental

Para crear una página utilizando una plantilla sigue los siguientes pasos:

Da un clic en el siguiente cuadro de texto, copia y pega el código en el Bloc de notas y guárdalo en el escritorio con el nombre: buscar.html

Contiene un sencillo formulario para buscar un término en Google, es la base para irle agregando funciones extras y criterios diferentes.

Dos clics en el archivo buscar.html, introduce un término de búsqueda, presiona la tecla Enter y comprueba que funciona, por supuesto si tienes conexión en este momento
Si no usas el navegador Internet Explorer (este navegador no admite abrir nuevas pestañas por cuestiones de seguridad) puedes hacer que los resultados de las búsquedas aparezcan en una nueva pestaña, para eso sustituye la primera línea del formulario por la siguiente:

<form method="get" action="http://www.google.com/search" target="google_window">

Agregar distintas variables de búsquedas al formulario

Buscar por un tipo de archivo.
Para agregar una variable que permita buscar por un tipo de archivo determinado copia y pega en la tercera línea de tu formulario (hay un espacio vacío) la siguiente entrada:

<input type="hidden" name="as_filetype" value=".doc" />

En este caso la búsqueda que realices será hecha exclusivamente para archivos .doc, sustitúyelo por la extensión de archivo o tipo de archivo que necesites buscar, por ejemplo: pdf, txt, jpg, bmp, etc.

Buscar en un sitio web específico.
Para agregar una variable que permita realizar la búsqueda en un sitio web determinado, copia y pega igual que en el paso anterior la siguiente entrada:

<input type="hidden" name="as_sitesearch" value="microsoft.com" />

En este caso la búsqueda que realices será hecha exclusivamente en el sitio web microsoft.com, sustitúyelo por el nombre de dominio del sitio web donde necesites buscar.

Agregar componente a la dirección URL.
Google permite el uso de los llamados operadores, son términos que al incluirse en la url, es decir la dirección con la que se hace la petición a Google, permite filtrar esta y reducir los resultados a preferencias determinadas, los más utilizados son los siguientes:

Allinurl: Buscar palabras y que solo aparezcan en una dirección web o URL.
Allintitle: Buscar palabras y que solo aparezcan en el título.
Allintext: Buscar palabras y que aparezcan todas en el cuerpo de la página.
Allinanchor: Buscar palabras y que aparezcan todas en vínculos de la página.
Inurl: Buscar palabras pero que no sea necesario que aparezcan todas en una dirección web o URL.
Intitle: Buscar palabras pero que no sea necesario que aparezcan todas en el título.

Hay multitud de combinaciones que se pueden utilizar, para agregar esta variable copia y pega igual que en el paso anterior la siguiente entrada:

<input type="hidden" name="hq" value="-inurl:htm -inurl:html intitle:'index of'" />

En este caso de ejemplo se incluyen los operadores: -inurl:htm -inurl:html intitle: e index.of, lo que significa que el término que escribas en el cuadro de búsqueda, Google lo buscará en páginas web en las que aparezca en la dirección url, pero que solo tengan las extensiones de archivo htm y html, además en el título y en el index de cualquier directorio. Es solo un ejemplo puedes experimentar con distintas combinaciones.

Restringir fecha de los datos a buscar
Es posible agregar una variable que permita restringir la fecha de los datos a buscar a un periodo determinado, para eso copia y pega la siguiente entrada:

<input type="hidden" name="as_qdr" value="m6" />

En este caso la variable utilizada reduce la búsqueda a archivos modificados solo en los últimos seis meses, sustitúyelo por el periodo que te interese.

Definir número de resultados de la búsqueda.
Otra variable muy útil a utilizar es definir la cantidad de resultados de la búsqueda, normalmente se muestran 10 pero esto no suele alcanzar la mayoría de las ocasiones, copia y pega la siguiente entrada para especificar un número diferente:

<input type="hidden" name="num" value="50" />

En este caso la variable utilizada permite que se muestren 50 resultados en la página de resultados de la búsqueda, configúralo a tu antojo.

Crear un formulario que permita seleccionar diferentes opciones

Es posible hacer el formulario un poco más complejo pero que permita seleccionar varias opciones lo que es muy práctico, para eso agrega el siguiente formulario completo a tu página y experimenta configurando las distintas opciones a tu gusto.

<form method="get" action="http://www.google.com/search">
<input type="text" name="q" size="31" maxlength="255" value="" /><br />
               Buscar por distintos tipos de archivos: 
               <select name="as_filetype">
                  <option value="ppt">PowerPoint</option>
                  <option value="xls">Excel</option>
                  <option value="doc">Word</option>
               </select><br />
               Buscar en distintos sitios web:
               <select name="as_sitesearch">
                  <option value="norfipc.com">NorfiPC.com</option>
                  <option value="microsoft.com">Sitio de Microsoft</option>
                  <option value="yahoo.es">Sitio de Yahoo</option>
               </select>
<input type="hidden" name="num" value="100" />
<input type="submit" value="Buscar" />
</form>

El resultado sería el siguiente formulario:

Códigos para crear otros formularios web

Plantillas para crear otros formularios o agregar en tu página web, prueba y usa el que te interese.

Multibuscador

Permite hacer una búsqueda en Google, de varios tipos de archivos para descargar gratis

Formulario para buscar término en Google Maps

Formulario para buscar información en Wikipedia

Formulario para buscar imágenes en Google

Formulario para buscar datos de un sitio o una dirección IP en Whois

Mas códigos para crear formularios de búsquedas para buscar información específica, puedes encontrarlos en la siguiente página: Informaciones y datos técnicos sobre Windows, internet y redes

Usar Bookmarklets en el navegador para hacer búsquedas en la red

Otro método que facilita realizar las búsquedas es utilizar Bookmarklets, no son más que vínculos que se guardan en los marcadores.
Contienen código Javascript, que permiten al ejecutarlos comenzar una búsqueda de forma automática del término introducido o de una palabra que se haya seleccionado en una página. Prueba el siguiente Bookmarklet y si te es útil, en la página que se sugiere encontrarás varios de ellos disponibles.
β Buscar en Google

➔ Instalar y agregar Bookmarklets en los navegadores web

Como resaltar términos de búsquedas en una página web

Es posible ver resaltados en una página web los resultados de una búsqueda hecha, es decir mostrar las palabras o frases que coincidan con los términos empleados, haya sido hecha esta búsqueda local o procedente de un motor de búsqueda de la red. Esto es posible gracias a un código javascript que es el encargado de agregar determinados tags css a las palabras o frases que corresponda.
Si llegaste a esta página enviado por un motor de búsqueda te darás cuenta al notar resaltados los términos que introdujiste.
Prueba con los siguientes botones para realizar una búsqueda local en esta página.

¿Como hacerlo, es necesario insertar el siguiente codigo en la parte inferior de tu página:

if (!searchText)  {
    alert("Ningun termino de busqueda fue encontrado.");
    return false;
  }  
  return highlightSearchTerms(searchText, treatAsPhrase, true, highlightStartTag, highlightEndTag);
}
function highlightGoogleSearchTerms(referrer)
{
  if (!referrer) {
    return false;
  }  
  var queryPrefix = "q=";
  var startPos = referrer.toLowerCase().indexOf(queryPrefix);
  if ((startPos < 0) || (startPos + queryPrefix.length == referrer.length)) {
    return false;
  }  
  var endPos = referrer.indexOf("&", startPos);
  if (endPos < 0) {
    endPos = referrer.length;
  }  
  var queryString = referrer.substring(startPos + queryPrefix.length, endPos);
  queryString = queryString.replace(/%20/gi, " ");
  queryString = queryString.replace(/\+/gi, " ");
  queryString = queryString.replace(/%22/gi, "");
  queryString = queryString.replace(/\"/gi, "");  
  return highlightSearchTerms(queryString, false);
}
function testHighlightGoogleSearchTerms()
{
  var referrerString = "http://www.google.com/search?q=javascript%20highlight&start=0";
  referrerString = prompt("Test the following referrer string:", referrerString);
  return highlightGoogleSearchTerms(referrerString);
}
</script>

Por supuesto que si lo vas a utilizar en varias páginas, debes de situarlo en un archivo externo de extensión .js y llamarlo como hago yo en esta página, mira el código fuente.
También debes de sustituir la etiqueta <body> por la siguiente:

Páginas relacionadas

◄ Buscar en internet, tener todos los buscadores en una sola pagina web
◄ Usar Bookmarklets en los navegadores web
◄ Trucos y opciones para realizar búsquedas con Google en internet
◄ Trucos y curiosidades de Google, resultados de busquedas interesantes
◄ Usar Google y otros buscadores desde la línea de comandos

norfiPC