Creando una plantillade forma fácil

Tito Alvarez

• 14 años de experiencia en programación PHP

• 8 años de experiencia en Joomla!

• Backender / Frontender / Plantillas comerciales /

Integrador / SysAdmin / Limpieza y otras cosas

• Experiencia en banca, pre-venta de software,

programador principal en Joomlashack

• Actualmente Programador Senior en redCOMPONENT

Agenda

• Conceptos generales de plantillas

• Proceso normal de creación de una plantilla

• Frameworks para plantillas

• Crear la plantilla con Wright

• Preguntas y respuestas

¿Qué es una plantilla Joomla?

• Conjunto de archivos

PHP, CSS e imágenes

• Permite cambiar

completamente la

visualización del sitio

web

• Plantillas comerciales y

gratis

Photo Credit: https://www.flickr.com/photos/49503019876@N01/7314722180/

responsivecompatibilidad con dispositivos

Archivos necesarios

• index.php

• templateDetails.xml

• less

• css

• images

• javascript

proceso de creaciónde una plantilla

Wireframes Diseño Análisis

PruebasHTML + CSS +

PHP

Photo Credit: https://www.flickr.com/photos/33472412@N00/5098835256/

Wireframesmapa general de la página

1. Crear el archivo index.phpcon la visualización HTML básica y las

llamadas a componentes y módulos

2. Crear los archivos

CSS/LESSimágenes y otros recursos

3. Crear el archivo templateDetails.xmlinformación básica de la plantilla

Photo Credit

4. Instalar la plantillacreando un archivo zip e instalando, o

usando la función descubrir

5. Seleccionar la plantillaen el manejador de plantillas de Joomla!

Frameworks para plantillas

• Incluyen una plantilla

base para poder crear

una nueva

• Incorporan funciones

comunes Joomla! que

acortan el camino

• Permiten fácil

personalización y crear

funciones avanzadas

Frameworks populares

• T3, de Joomlart

t3-framework.org

• Gantry, de RocketTheme

www.gantry-framework.com

• Warp, de Yootheme

www.yootheme.com/themes/warp-framework

• Wright, de Joomlashack

wright.joomlashack.com

Creando nuestra plantilla

con Wright

Photo Credit

1. Descargar Wrightwright.joomlashack.com

2. Instalar Wrightdesde el instalador de Joomla

3. Ir al gestor de plantillasy listar las plantillas únicas

Photo Credit

4. Entrar a la plantillay activar la compilación less

Photo Credit

4. Editar los archivosde la plantilla Wright

Photo Credit

5. Editar el archivo variables-generic.lesspara los cambios más globales de la plantilla

Photo Credit

6. Agregar reglas adicionales de estilotemplate.less

Gracias!