Junto a Comunidad Joomla! , tengo el agrado de presentarles el Manual de desarrollo de plantillas para Joomla! 1.5: Guía paso a paso, una completa ayuda para crear un template funcional, con ejemplos 100% reales y prácticos.
Antes de empezar
- Pueden descargar los archivos fuentes y la versión en PDF del manual desde Comunidad Joomla!
Además necesariamente se debe tener:
- Conocimiento básico de HTML, CSS y PHP;
- Conocimiento del entorno de Joomla! y conceptos básicos (que es un modulo, que es un componente, etc)
- Un servidor local o remoto con Joomla! 1.5 instalado;
- Un editor de programación (por ejemplo Notepad++);
- Leer los tutoriales para crear un template para Joomla! 1.0.x no es 100% necesario, puede servir para agilizar el aprendizaje ya que el modo de trabajo y los conceptos son los mismos.
Índice
- Estructura básica de una plantilla para Joomla! 1.5.x
- Creación de la carpeta para nuestro template
- Creación de templateDetails.xml
- Creación de index.php
- Edición de template.css
- Manejo de parámetros en la plantilla
- Creación de template_thumbnail.png
- Apuntes finales
Estructura básica de una plantilla para Joomla! 1.5.x
Básicamente un template puede estar formado por las siguientes carpetas y archivos:
Carpetas:
- css: Es la carpeta que contiene los estilos en cascada del template.
- html: Esta carpeta posee los archivos que funcionaran como plantilla especifica para módulos y componentes. Su uso no es prioritario pero es una funcionalidad a explotar si deseamos un código personalizado para componentes/módulos.
- images: Contendrá las imágenes usadas para el diseño.
Archivos:
- index.php: El archivo principal, contendrá todo el HTML y directivas PHP de Joomla! para cargar el contenido (artículos, componentes, módulos, etc.)
- templateDetails.xml: Determinante para que la plantilla sea reconocida en el back-end del CMS. Posee diversos datos como licencia, autor, e-mail, etc. En Joomla! 1.5 la plantilla podrá tener parámetros manejables desde el back-end para cambiar la visualización del template. En este archivo se agregaran los parámetros y las posiciones de disponibles para mostrar los módulos.
- template_thumbnail.png: Es la imagen que actuará como previsualización del template en la administración.
- params.ini: Contendrá los valores para configurar los parámetros del template. Si la plantilla no posee parámetros para configurar, este archivo no será necesario.
- template.css: Es el estilo en cascada principal que se encuentra dentro de la carpeta ‘css’. En la rama de Joomla! 1.0.x este archivo tenía el nombre de template_css.css
- favicon.ico: Es el favicon que usaremos en nuestro sitio.
- imagenes varias: Conformaran el diseño de la plantilla.
Dentro de la carpeta ‘html’, como decía más arriba, estarán archivos y carpetas específicos para los módulos y componentes del sitio. Con esto podremos manejar a nuestro gusto la apariencia y el output de dichos componentes y módulos. La idea es que la plantilla prevalezca por encima del output HTML que genera Joomla! De esta forma, por ejemplo, podremos reemplazar todas las tablas que genera tal componente y reemplazarlas por DIVs.
Creación de la carpeta para nuestro template
Lo primero que haremos será crear la carpeta en donde se alojaran los archivos de nuestra plantilla. Para eso vamos al directorio ‘templates’ de Joomla! y creamos una carpeta con el nombre que queramos, en minúscula, y en caso de ser varias palabras, sin espacios. Luego podemos crear las subcarpetas necesarias: css, images y/o HTML
