Está en la página 1de 5

Cmo se crea una plantilla para Joomla

Haz tu propio template para Joomla 1.5


Las plantillas ofrecen al usuario la posibilidad de elegir entre una gran variedad de diseos la que ms se ajuste a sus necesidades, pero aunque existan tantas creaciones en websites como Template monster, no siempre se encuentra la que se desea. Para esto un desarrollador puede crear y personalizar sus propias plantillas. Como se crea una plantilla para Joomla! La creacin y edicin de plantilla es un proceso fcil y muy prctico. A continuacin se describir como crear una plantilla bsica para Joomla, lo dems corre por cuenta de la imaginacin del creador. Una plantilla est compuesta por varias carpetas y archivos, cada uno de estos representa una parte de la plantilla. Algunos de estos archivos son: Carpetas:

y y

css: Contiene los estilos en cascada de la plantilla. html: Contiene los archivos que funcionaran como plantilla especfica para mdulos y componentes. Con estos archivos se puede manejar la apariencia de los mdulos y componente.

images: Contiene las imgenes usadas para el diseo de la plantilla.

Archivos: index.php: El archivo principal, contendr todo el HTML y directivas PHP de Joomla! para cargar el contenido (artculos, componentes, mdulos, etc.)

templateDetails.xml: Permite que la plantilla sea reconocida en el back-end del CMS. En este archivo se agregaran los parmetros y las posiciones de disponibles para mostrar los mdulos.

y y

template_thumbnail.png: Es la imagen que actuar como pre visualizacin de la plantilla en la administracin. 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 tena el nombre de template_css.css

favicon.ico: Es el favicon que se usar en el sitio.

Para iniciar con la creacin de la plantilla, es necesario crear la carpeta donde estar toda la informacin de esta, incluyendo los archivos mencionados anteriormente. Lo que se debe hacer es crear una carpeta en el

directorio 'templates' de Joomla!, con el nombre que se desee, en minscula y sin espacios; se crean dentro de esta las subcarpetas necesarias: HTML, css, images

Para crear el archivo templateDetails.xml:

El templateDetails.xml se puede dividir en cuatro partes: el contenido de Datos, Archivos y Posiciones. Para el contenido de Datos se debe ingresar la siguiente informacin: <name> Nombre de la plantilla</</name> <creationDate> Fecha de creacin </creationDate> <author> Nombre del autor </author> <copyright> Licencia </authorEmail> <authorUrl> Web del autor </authorUrl> <version> Versin </version> <description> Aqu va la descripcin, puede usarse HTML o texto plano </description> Esta informacin es sobre la plantilla y el autor.

Para el contenido de Archivos se debe ingresar la siguiente informacin:

<files> < filename > index.php </ filename> < filename > templateDetails.xml </ filename > < filename > favicon.ico </ filename > < filename > template_thumbnail.png </ filename > < filename > css/template.css </ filename > </ files >

Esta informacin es sobre los archivos que se han utilizado para el diseo, para luego comprimir todo en ZIP y tener un instalador de la plantilla. Como se est trabajando directamente en Joomla no es necesario referenciar todos los archivos, pero se debe tener en cuenta hacerlo.

Para las posiciones se debe ingresar la siguiente informacin:

< positions > < position > left </ position > < position > right </ position > < position > user3</ position > </ positions > Estas posiciones son las que se usaran para mostrar el contenido en el sitio.

Crear el index.php:
Para la creacin del index.php, se debe insertar el HTML que formar la maquetacin de la plantilla. Se debe crear un encabezado, un cuerpo y un pie de pgina.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <jdoc:include type="head" /> <link rel="stylesheet" href="/templates//css/template.css" type="text/css" /> </head> <body> <!-- Contenedor --> <div id="contenedor"> <!-- Comienzo encabezado--> <div id="header"> <h1><a href="/index.php"></a></h1> </div> <!-- Fin encabezado --> <!-- Comienzo navegacion--> <div id="navegacion"> <jdoc:include type="modules" name="user3" style="xhtml" /> </div> <!-- Fin navegacion --> <!-- Columna izquierda --> <div id="izquierda">

<jdoc:include type="modules" name="left" style="xhtml" /> </div> <!-- Fin columna izquierda --> <!-- Comienzo contenido --> <div id="contenido"> <jdoc:include type="component" /> </div> <!-- Fin contenido --> <!-- Columna derecha --> <div id="derecha"> <jdoc:include type="modules" name="right" style="xhtml" /> </div> <!-- Fin columna derecha --> <!-- Comienzo pie de pgina --> <div id="footer"> <!--Cargo el footer--> <?php include_once('includes/footer.php'); ?> </div> <!-- Fin footer --> </div> <!-- Fin contenedor --> </body> </html>

Este es un ejemplo de una plantilla bsica de tres columnas, una barra de navegacin, un encabezado y un pie de pgina.

Crear css:
En la carpeta 'css' se crea un archivo template.css el cual tendr los estilos que usar la plantilla. A continuacin unos ejemplos de CCS: { padding: 0;

margin: 0; } body { font-size: 62.5%; font-family: Verdana, Arial, Sans-Serif; color: #333; background-color:white; }

Para finalizar se crea el template_thumbnail.png que es la imagen que se pre visualiza de la plantilla, no hay un tamao estndar para esto pero por general que utiliza de 200px de ancho y 150px de alto. Si no quieres emplear tu tiempo en crear una plantilla te recomendamos buscar un template de calidad que distinga tu website de otros en Template Monster. Siempre podrs realizar ms tarde las modificaciones necesarias.

También podría gustarte