Estructura básicas de plantillas en joomla!

24
Plantillas en Joomla! Veamos la parte fácil

description

Es la presentación 2 de 5 que se dieron en el taller de creación de plantillas impartido por el Grupo de Usuarios de Joomla! en Guatemala el 28 de febrero 2011

Transcript of Estructura básicas de plantillas en joomla!

Page 1: Estructura básicas de plantillas en joomla!

Plantillas en Joomla!

Veamos la parte fácil

Page 2: Estructura básicas de plantillas en joomla!

¿Qué una plantilla de Joomla!?

Barrie North, CompassDesigns.net

Page 3: Estructura básicas de plantillas en joomla!

Elementos de una plantilla

Page 4: Estructura básicas de plantillas en joomla!

¿Cómo se maneja el contenido?

Todo el contenido es manejado por el código de Joomla!, y en general son tres grandes grupos

Cada grupo es manejado de forma distinta por las plantillas

Page 5: Estructura básicas de plantillas en joomla!

Elementos es una Plantilla

Page 6: Estructura básicas de plantillas en joomla!

¿Qué es una posición?

• Es la ubicación física dentro de la página donde se muestra un módulo.

• Una forma sencilla de ver las posiciones disponibles es www.nuestrositio.com/index.php?tp=1

Page 7: Estructura básicas de plantillas en joomla!

Posiciones

Page 9: Estructura básicas de plantillas en joomla!

Chrome: table

Chrome: outline

Page 10: Estructura básicas de plantillas en joomla!

Nuestra primer Plantilla

Entendiendo el proceso, el arte lo agregamos poco a poco

Usando como base el tutorial de

Page 11: Estructura básicas de plantillas en joomla!

Estructura física

Page 12: Estructura básicas de plantillas en joomla!

Template Details

Page 13: Estructura básicas de plantillas en joomla!

Sigamos con el XML

Page 14: Estructura básicas de plantillas en joomla!

Index

Html<html>

<body bgcolor="#FFFFFF"></body>

</html>

Se incluye en cada carpeta de nuestro template, para evitar que se liste el mismo en el navegador

Page 15: Estructura básicas de plantillas en joomla!

A lo que venimos

<head><jdoc:include type="head" /><link rel="stylesheet" href="templates/<?php echo $this-

>template?>/css/template.css" type="text/css" />

</head>

Page 16: Estructura básicas de plantillas en joomla!

Agreguemos el contenido

Page 17: Estructura básicas de plantillas en joomla!

Ya funcionaSolo nos hace falta ponerlo bonito

Page 18: Estructura básicas de plantillas en joomla!

Un poco de estilo CSS

Page 19: Estructura básicas de plantillas en joomla!
Page 20: Estructura básicas de plantillas en joomla!

Joomla 1.6

Algunas pequeñas diferencias con lo que ya vimos

Page 21: Estructura básicas de plantillas en joomla!

En Index.php

Page 22: Estructura básicas de plantillas en joomla!

En templateDetails.xml

<params> <param name="templateTheme" type="list" default="theme1" label="Template Theme" description="Choose your template theme"> <option value="theme1">theme1</option> <option value="theme2">theme2</option> <option value="theme3">theme3</option> </param></params>

<config> <fields name="params"> <fieldset name="advanced"> <field name="templateTheme" type="list" default="theme1" label="Template Theme" description="Choose your template theme"> <option value="theme1">theme1</option> <option value="theme2">theme2</option> <option value="theme3">theme3</option> </field> </fieldset> </fields></config>

Page 23: Estructura básicas de plantillas en joomla!

En templateDetails.xml