Cuando un diseñador que viene de otros sistemas se encuentra con la necesidad de modificar la maquetación y CSS de un template de Joomla se encuentra con que no sabe donde se está "pintando" el HTML.
En Joomla para encontrar las cosas lo mas importante es identificar qué es para nuestro gestor de contenidos lo que queremos modificar.
Podríamos estar ante una de las siguientes posibilidades:
- Componentes
- Módulos
- Plugins
- Literales
Empezaré explicando los componentes con una pequeña pista que ayuda a idenficar el tipo de elemento.
¿Qué es un componente?
Cuando desde el panel de administración se crea un nuevo elemento de menú se despliega un listado de opciones disponibles como "tipo de menú". Los componentes son esos "tipos de menús".
En la imágen de la derecha se pueden ver diferentes componentes que pueden ser elegidos como elementos de menú. Es importante saber que por cada componente existirán una o mas vistas. Por ejemplo, en el caso del componente encargado de mostrar los artículos (com_content) existen varias vistas para mostar un solo artículo, listar artículos de una categoría concreta etc.
Una vez que tenemos idenficado que se trata de un componente también resulta sencillo saber como se llama el componente, es suficiente con seleccionar ese tipo de menú en un elemento de menú nuevo y fijarse en fijarse en el enlace que se crea que tendrá la siguiente forma:
index.php?option=com_content&view=article
En el ejemplo en componente se llama content y la vista article. Si se quiere modificar directamente la vista que crea el HTML resultante del componente hay que ir a la siguiente ruta
/components/com_content/views/article/tmpl/default.php
Aún así se recomienda no modificar la vista del componente directamente para no tener problemas en futuras actualizaciones del componente. Resulta mejor opción usar la posibilidad que da Joomla de reescribir la vista del componente desde el template.
Realmente no cuesta nada llevar al template la sobreescritura, puede pasar que en algunos componentes la poca separación de capa de presentación o induso la necesidad de "que funcione y sea barato y rápido" nos haga caer en la tentación de realizar la modificación directamente pero yo lo dejaría solo como último recurso si la sobreescritura no funciona como se desea.
A pesar de que se explica perfectamente en esta página voy a explicarlo en castellano y de manera resumida y práctica.
¿Cómo sobreescribir desde el template la vista de un componente?
Siguiendo con el ejemplo del mostrado de artículos imaginemos que queremos modificar la vista que muestra un artículo cuya ruta hemos comentado pero desde el template. En caso de existir una sobreescritura en el template, Joomla hará caso al template. Además para llevar estos cambios de un template a otro simplemente se debe copiar la carpeta al nuevo template.
En el ejemplo anterior se debería de crear en el template la siguiente estructura:
RUTA_TEMPLATE/html/com_NOMBRE_COMPONENTE/NOMBRE_VISTA/NOMBRE_FICHERO_PHP.php
En el caso anterior crearíamos la siguiente estructura (imaginando el template protostar)
Se copiaría el fichero /components/com_content/views/article/tpl/default.php
A la siguiente ruta del template:
/templates/protostar/html/com_content/article/default.php
En caso de que existan mas de un fichero php como es este caso se recomienda copiar todos para evitar problemas.
Este método funcionará bien siempre que la programación del componente se haya realizado siguiendo las recomendaciones para programar en Joomla y se separen correctamente las diferentes capas. En la mayor parte de los componentes será muy sencillo realizar estas sobreescrituras.
Con esto termino este primer apartado de la guía que espero que os guste y difundais entre vuestros compañeros. No olvideis que teneis a vuestra disposición los botones sociales de Facebook, Twitter y Google+.
También os animo a participar con vuestra dudas y sugerencias en el apartado de comentarios que se muestra justo debajo de cada artículo, no es necesario registrarse para hacerlo.
Ya está disponible la segunda parte de la guia en la que se muestra como realizar esto mismo desde el menú de administración de Joomla 3.x