Microsoft Expression Web: página de búsqueda

En este capítulo, aprenderemos cómo agregar una opción de búsqueda o un cuadro de búsqueda al sitio web. Si se trata de un sitio grande, deberá tener un cuadro de búsqueda en el sitio para que el usuario pueda encontrar los datos fácilmente. Hay muchos gratuitos disponibles, como Windows Live, Google, etc.

Búsqueda en vivo de Windows

Los siguientes pasos le muestran cómo agregar un cuadro de búsqueda de Windows Live a su página web y luego configurar el formulario de búsqueda para buscar en toda la Web o solo en su sitio web.

Step 1 - Crea una nueva página HTML y llámala SearchPage.

Step 2 - Vaya al menú Formato y seleccione Dynamic Web Template → Attach Dynamic Web Template…opción. Seleccione el archivo master.dwt y haga clic en el botón Abrir.

Step 3 - Agreguemos el siguiente código dentro de la región editable.

<form method = "get" action = "http://search.live.com/results.aspx"> 
   <input type = "hidden" name = "cp" value = "1252"/> 
   <input type = "hidden" name = "FORM" value = "FREESS"/> 
   <table style = "background-color: #ffffff;"> 
      <tr> 
         <td>
            <a href = "http://search.live.com/"> 
               <img src = "http://search.live.com/s/affillogoLive.gif" 
                  style = "border:0px;" alt = "Live Search"/> 
            </a> 
         </td> 
         <td> 
            <input type = "text" name = "q" size = "30" /> 
            <input type = "submit" value = "Search Site"/> 
            <input type = "hidden" name = "q1" 
               value = "site:http://www.microsoft.com/expression"/> 
         </td> 
      </tr> 
   </table> 
</form>

Step 4- Guarde la página. Vaya al menú Archivo y seleccione Vista previa en el navegador.

Step 5- Verá Windows Live Search en su página web. Ingresemos algo en la búsqueda y hagamos clic en el botón Buscar sitio

Step 6- Como puede ver, buscará en la web. Si desea restringir la búsqueda solo a su sitio web, debe especificar el dominio de su sitio con el siguiente nombre en lugar de www.microsoft.com/expression

<input type = "hidden" name = "q1" value = "site:http://www.microsoft.com/expression"/>

Step 7 - Del mismo modo, puede agregar la opción de búsqueda de Google agregando el siguiente código en la región editable.

<form method = "get" action = "http://www.google.com/search"> 
   <div style = "border: 1px solid black; padding: 4px; width: 20em; margin: 0px auto 0px auto"> 
      <table border = "0" cellpadding = "0"> 
         <tr> 
            <td class = "center"> 
               <input type = "text" name = "q" size = "25" maxlength = "255" value = "" /> 
               <input type = "submit" value = "Google Search" /> 
            </td> 
         </tr> 
         <tr> 
            <td align = "center" style = "font-size: 75%"> 
               <input type = "checkbox" name = "sitesearch" 
                  value = " http://www.microsoft.com/expression" checked = "checked" /> 
               Only search this website<br /> 
            </td> 
         </tr> 
      </table> 
   </div> 
</form>

Step 8 - Guarde su página HTML y verá un cuadro de búsqueda, un botón de búsqueda, una casilla de verificación y una etiqueta de casilla de verificación.

Step 9- Para restringir a los usuarios a buscar solo en su sitio web, seleccione la casilla de verificación y vaya al panel Propiedades de etiqueta y configure la propiedad Valor en la URL de su sitio web, como www.microsoft.com/expression .

Step 10- Guarde su página y obtenga una vista previa en el navegador. Ahora verá la opción de búsqueda de Google en su página web.