Jueves, 10 Noviembre 2011 22:09

Sustituir el buscador nativo de la plantilla Webempresa para Joomla! 1.7 por el módulo PixSearch Ajax Search

Escrito por 
CMS:  Joomla! |  Versión:  1.7 |  Nivel de dificultad:  Básico |  Tiempo estimado de lectura:  15 minutos


PixSearch Ajax SearchRecientemente liberamos en Webempresa la primera plantilla gratuita para Joomla! 1.7 que esperamos haya tenido aceptación entre el público no solo por ser de uso libre sino por permitir ampliar el abanico de plantillas gratuitas, tan escaso aún en Joomla! 1.7.

Como todo en la vida, esto también es mejorable, y en un esfuerzo por ir explicando como un usuario puede ir mejorando no solo esta plantilla , sino cualquiera que se proponga, publicamos estos pequeños videotutoriales donde aportamos los datos oportunos para que en pocos minutos los cambios puedan materializarse en cualquier sitio web. Vamos a ver en la plantilla Webempresa para Joomla! 1.7 como sustituir el buscador nativo de Joomla!, utilizado en la misma, por un módulo de búsquedas que utiliza tecnología AJAX para mejorar la presentación de dichas búsquedas al usuario, lo que sin duda irá en beneficio del uso que del mismo hagan quienes visiten nuestro sitio web.

El módulo desarrollado por Pixpro se llama PixSearch Ajax Search y está disponible para todas las ramas de Joomla!, naturalmente incluida la 1.7, que es en la que vamos a ver como instalarlo, para la plantilla indicada aunque puede ser utilizado para cualquier plantilla Joomla!.

El módulo PixSearch trata de imitar una búsqueda similar a del sitio web de apple.com. Su funcionamiento se basa en una consulta AJAX utilizando como base el componente nativo de Joomla! "com_search" mostrando los resultados al instante (sin necesidad de pulsar "Intro" (Entrar)) mientras se escribe en la caja de texto y presentar estos resultados de una forma comprensible y estética.

Un detalle que podremos observar en la plantilla Webempresa al sustituir el buscador nativo de Joomla! publicado en la posición "search" es que los resultados quedan ocultos por el slideshow de portada, lo que a todas luces resulta muy incomodo y dificulta la vista de los resultados obtenidos con el buscador PixSearch Ajax Search. Esto tiene sencilla solución, pues no hay mas que añadir la propiedad "z-index" en el estilo recogido en el módulo ARI Image Slider con un nivel de profundidad inferior al del buscador para el slideshow de forma que quede detrás del mismo.

Editamos el módulo y añadimos la propiedad de la forma siguiente, tal como se muestra en la captura:

Antes:

.nivoSlider{
box-shadow:0 0 4px #a3a3a3;
-moz-box-shadow:0 0 4px #a3a3a3;
}

Despues:

.nivoSlider{
box-shadow:0 0 4px #a3a3a3;
-moz-box-shadow:0 0 4px #a3a3a3;
z-index:0;
}



En el siguiente vídeo realizamos la instalación del módulo y su correspondiente publicación en la posición "search" de la plantilla y añadimos la propiedad CSS en el módulo para que los resultados sean visibles de forma correcta.



Con este módulo mejoramos la forma en que se realizan las búsquedas con resultados instantáneos y una presentación más elegante.



¿Te ha resultado interesante este artículo?

Suscríbete para recibir consejos exclusivos para WordPress, Joomla y PrestaShop



Luis Méndez Alejo

Miembro del equipo técnico de Webempresa.
Coordinador de contenidos en el Blog y en Youtube.
Google+