Personalizar módulos y componentes con Template Override

Template override es una técnica para redefinir la forma de representación en pantalla de un componente o módulo de Joomla. Esta funcionalidad se incluyó a partir del Joomla 1.5. El objetivo principal de esta técnica es permitir actualizar Joomla sin tener que preocuparse de que se vean afectados los cambios realizados previamente para personalizar el portal. Un ejemplo de posible aplicación de esta técnica consiste en personalizar la salida de un determinado módulo  o componente para conseguir cumplir los niveles de accesibilidad o el estándar XHTML.

¿Cómo funciona template override?

Cada vez que Joomla genera una página web mira en la plantilla que está usando el sitio web para ver si tiene un redefinición de algunos de los componentes o módulos empleados. Si encuentra que se ha redefinido un componente o modulo se usa su redefinición, en caso contrario usa el que está definido en el core.

Un ejemplo de template override

El módulo de búsqueda de Joomla mod_search no cumple la accesibilidad cuando se establece que el botón que se pulsa para iniciar la búsqueda sea una imagen. Esto se debe a que el diseñador de este módulo olvidó incluir la etiqueta ALT=”Descripción de la imagen”. Para hacer que este módulo de Joomla cumpla la accesibilidad y que no se vea afectado en futuras actualizaciones se utiliza template override. Para usar esta técnica en la plantilla se debe crear una carpeta con el nombre “html”. La ruta de esa carpeta debe ser de la forma ..\templates\nombreplantilla\html\ , en ella se guardan las redefiniciones de los módulos y componentes.

Para redefinir un módulo o componente se debe copiar el contenido de su carpeta tmpl. Pegar esos archivos en ..\templates\nombreplantilla\html\XXX , siendo XXX el nombre del módulo o componente. Ahora solo queda modificar esos archivos para obtener el comportamiento deseado.

En el caso de mod_search se copian los archivos default.php e index.html en la ..\templates\nombreplantilla\html\mod_search. Para que cumpla la accesibilidad la línea 10 se debe añadir la etiqueta ALT, como se muestra a continuación:

 

10
11
$button = '<input type="image" value="'.$button_text.'"
class="button'
.$moduleclass_sfx.'" alt="botón buscar" src="'.$img.'"/>';

Si visualizamos en el navegador se puede observar que el código del core se ha reemplazado por el código que se ha redefinido empleando template override.

Escribir un comentario

Por favor procura que tus comentarios estén relacionados con la entrada, comenta con tu nombre y no pongas enlaces en tu comentario. Intenta también respetar a los demás lectores, los comentarios off topic, promocionales, ofensivos o ilegales serán editados y borrados.


Código de seguridad
Refescar