8/7/2019 Crear plantillas Joomla
1/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 1
Desarrollando templates para Joomla! 1.5
Gua paso a paso
Por Comunidad Joomla!comunidadjoomla.org
8/7/2019 Crear plantillas Joomla
2/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 2
ndice
Por Comunidad Joomla!............................................................................................................1ndice........................................................................................................................................2Antes de empezar.....................................................................................................................3Estructura bsica de una plantilla para Joomla! 1.5.x ................................................................3
Carpetas...............................................................................................................................4css....................................................................................................................................4html ..................................................................................................................................4images..............................................................................................................................4
Archivos................................................................................................................................4index.php..........................................................................................................................4templateDetails.xml ..........................................................................................................4template_thumbnail.png....................................................................................................4params.ini.........................................................................................................................4template.css .....................................................................................................................4favicon.ico ........................................................................................................................4imgenes varias ...............................................................................................................5
Creacin de la carpeta para nuestro template ...........................................................................5Creacin de templateDetails.xml...............................................................................................5
Datos....................................................................................................................................5Archivos................................................................................................................................6Posiciones............................................................................................................................6Parmetros...........................................................................................................................6
Creacin de index.php ..............................................................................................................8.................................................................................................9$this->template.....................................................................................................................9$mainframe->getCfg('sitename') ...........................................................................................9............................................9 .....................................................................................10
Edicin de template.css ..........................................................................................................12Clases pertenecientes a contenido......................................................................................15
componentheading .........................................................................................................15contentheading...............................................................................................................15buttonheading.................................................................................................................15small...............................................................................................................................15createdate ......................................................................................................................16readon............................................................................................................................16article_separator.............................................................................................................16
Clases pertenecientes a mdulos........................................................................................16moduletable....................................................................................................................16h3...................................................................................................................................17active..............................................................................................................................17item................................................................................................................................17parent.............................................................................................................................17
Otras clases CSS importantes ............................................................................................17button.............................................................................................................................17inputbox..........................................................................................................................17pagenav .........................................................................................................................17
modifydate......................................................................................................................17sectiontableentry1 / sectiontableentry2 ...........................................................................18
Manejo de parmetros en la plantilla .......................................................................................22Creacin de template_thumbnail.png ......................................................................................24Apuntes finales .......................................................................................................................24Recursos para el futuro...........................................................................................................25
8/7/2019 Crear plantillas Joomla
3/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 3
Antes de empezar
Necesariamente se debe tener:
o Conocimiento bsico de HTML, CSS y PHP;o Conocimiento del entorno de Joomla! y conceptos bsicos (que es un modulo,
que es un componente, etc.)o Un servidor local o remoto con Joomla! 1.5 instalado;o Un editor de programacin (por ejemplo Notepad++ para Windows);
Estructura bsica de una plantilla para Joomla! 1.5.x
Bsicamente un template puede estar formado por las siguientes carpetas y archivos:
Estructura de una plantilla en Joomla!
8/7/2019 Crear plantillas Joomla
4/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 4
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 mdulos ycomponentes. Su uso no es prioritario pero es una funcionalidad a explotar si deseamos uncdigo personalizado para componentes/mdulos.
images
Contendr las imgenes usadas para el diseo.
Archivosindex.php
El archivo principal, contendr todo el HTML y directivas PHP de Joomla! para cargar elcontenido (artculos, componentes, mdulos, etc.)
templateDetails.xml
Determinante para que la plantilla sea reconocida en el back-end del CMS. Posee diversosdatos como licencia, autor, e-mail, etc. En Joomla! 1.5 la plantilla podr tener parmetrosmanejables desde el back-end para cambiar la visualizacin del template. En este archivo seagregaran los parmetros y las posiciones de disponibles para mostrar los mdulos.
template_thumbnail.png
Es la imagen que actuar como previsualizacin del template en la administracin.
params.ini
Contendr los valores para configurar los parmetros del template. Si la plantilla no poseeparmetros 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 deJoomla! 1.0.x este archivo tena el nombre de template_css.css
favicon.ico
Es el favicon que usaremos en nuestro sitio.
8/7/2019 Crear plantillas Joomla
5/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 5
imgenes varias
Conformaran el diseo de la plantilla.
Dentro de la carpeta 'html', como deca ms arriba, estarn archivos y carpetas especficospara los mdulos y componentes del sitio. Con esto podremos manejar a nuestro gusto laapariencia y el output de dichos componentes y mdulos. La idea es que la plantilla prevalezcapor encima del output HTML que genera Joomla! De esta forma, por ejemplo, podremosreemplazar todas las tablas que genera tal componente y reemplazarlas por DIVs.
Creacin de la carpeta para nuestro template
Lo primero que haremos ser crear la carpeta en donde se alojaran los archivos de nuestraplantilla. Para eso vamos al directorio 'templates' de Joomla! y creamos una carpeta con elnombre que queramos, en minscula, y en caso de ser varias palabras, sin espacios. Luegopodemos crear las subcarpetas necesarias: css, images y/o HTML
Nombre de la carpeta que alojar nuestro template
Creacin de templateDetails.xml
Podemos dividir en cuatro partes el contenido de templateDetails.xml: Datos, Archivos,Posiciones y Parmetros.
Datos
Aqu, entre cada etiqueta pondremos los datos especficos de la plantilla como su versin,autor, email, pgina web, ao, licencia y descripcin:
XML
Nombre del template
Fecha de creacin
Nombre del autor
LicenciaE-mail del autor
Web del autor
Versin
Aqui va la descripcin, puede usarse HTML o texto plano.
]]>
8/7/2019 Crear plantillas Joomla
6/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 6
Archivos
Cuando hayamos terminado nuestro trabajo, aqu deberemos especificar todos los archivosque hemos utilizado para el diseo, para luego comprimir todo en ZIP y tener un instalador dela plantilla. Como ahora no necesitamos un instalador (ya que estamos creando el templatedentro del mismo Joomla!) podemos dejar estos campos incompletos, pero es muyrecomendable que al terminar el trabajo lo completemos debidamente:
XML
index.php
templateDetails.xml
template_thumbnail.png
favicon.ico
css/template.css
images/imagen.png
PosicionesEs importante saber con anticipacin que posiciones usaremos y cuantas en nuestro sitio paraplanificar en donde mostrarlos en la plantilla.
XML
left
right
user3
Parmetros
Si deseamos realizar una plantilla ms verstil, podemos agregarle parmetros para sermanejados desde el Back-end. Por ejemplo, si nuestra plantilla cuenta con la posibilidad deconfigurar los colores de fondo, esta opcin estar habilitada para ser activada desde laadministracin de Joomla!. En Joomla! 1.0.x, si aadamos un parmetro, este solo poda sermodificado tocando el index.php de la plantilla. Podemos encontrar un ejemplo de parmetrosde template accediendo a Extensiones --> Gestor de plantillas -->rhuk_milkyway. En lacolumna derecha veremos los parmetros para dicho template:
Parmetros para el template rhuk_milkyway
8/7/2019 Crear plantillas Joomla
7/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 7
XML
Azul
Rojo
Verde
Los valores por default y cada vez que modificamos un parmetro desde el back-end, songuardados en el archivo params.ini. Corre por nuestra cuenta si nosotros queremos o noaadir este tipo de posibilidad a nuestro diseo. Por lo general son las plantillas comerciales lasque lo implementan, ya que le otorga mucha flexibilidad al producto. Ms adelante veremos unejemplo de utilizacin de parmetros.
Entonces templateDetails.xml puede tener la siguiente apariencia:
XML
Nombre del template
Fecha de creacion
Nombre del autor
Licencia
E-mail del autor
Web del autor
Version
]]>
index.php
templateDetails.xml
template_thumbnail.png
favicon.ico
css/template.css
images/imagen.png
left
right
user3
Azul
Rojo
Verde
8/7/2019 Crear plantillas Joomla
8/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 8
Creacin de index.php
Para la creacin del index.php, lo primero que haremos ser insertar el HTML que formar lamaquetacin de la plantilla. Para eso partiremos desde un layout bsico de tres columnas,barra de navegacin, header y footer. Entonces en index.php creamos el HTML:
PHP
8/7/2019 Crear plantillas Joomla
9/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 9
Lo siguiente ser ir incorporando las directivas que cargaran toda la informacin para que laplantilla funcione. Veamos las bsicas:
Esta directiva ir dentro de la cabecera HTML. Cargar el ttulo de la pgina en cuestin,metatags, feed, y framework javascript. Joomla! a partir de la versin 1.5 decide usar comoframework javascript a Mootools. Y esto lo hace de forma nativa, es decir que no nos d laposibilidad de elegir entre cargarlo o no (a menos que editemos algn archivo fuente).Obviamente no hay que tomarlo para mal, sino al revs, entre lneas el equipo de Joomla! nosesta diciendo que echemos rienda suelta a nuestra imaginacin y utilicemos a Mootools paraaadir efectos, nuevas propiedades o lo que queramos a la plantilla. En otras palabras, queexplotemos todo su potencial.Otro hecho es que para mostrar nuestro favicon, tendremos que aadir las l neas manualmentepara mostrarlo.
$this->template
Obtendremos el nombre de la carpeta contenedora de nuestra plantilla. Se puede utilizar paracargar el estilo en cascada, favicon y cualquier archivo que queramos y se encuentre dentro deesta carpeta.
Con esto ya podemos crear la cabecera HTML de la plantilla:
PHP
8/7/2019 Crear plantillas Joomla
10/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 10
mdulos derechos, el parmetro ser 'name="right"'. El segundo parmetro posee algunasvariantes, el uso de cada una va a depender de nuestras necesidades. Las variedades de estilopueden ser 'table', 'horz', 'xhtml', 'rounded' y 'raw'. Tanto con 'table' como con 'horz' elcontenido del mdulo ser cargado a travs de tablas, la diferencia es que el primer parmetrolo har de forma vertical (a travs de una columna) y el segundo lo har de forma horizontal (atravs de una fila). Si utilizamos 'xhtml' el contenido en vez de ser cargado en tablas serinsertado en DIVs. El parmetro 'rounded' es similar a 'xhtml' con la diferencia que carga elcontenido en varios DIVs anidados. Este ltimo se suele utilizar para realizar bordesredondeados a travs de imgenes. Finalmente el parmetro 'raw' cargar el contenido neto,sin contenedores ni ttulo.
Ejemplo: Queremos insertar en DIVs todos los mdulos izquierdos en determinada parte delsitio, la directiva quedar conformada por:
PHP
Ejemplo 2: Queremos cargar los mdulos que se encuentran en la posicin 'top' de manerahorizontal:
PHP
En caso de no especificar el estilo, por default el valor ser 'table'.
Con ella cargaremos el contenido principal del sitio (artculos, secciones, categoras, etc.). Adiferencia de la inclusin de mdulos, esta directiva no posee parmetros para manejar endonde cargar el contenido.
Aprendiendo esto ya estaremos resolviendo el 80% de index.php, quedando:
8/7/2019 Crear plantillas Joomla
11/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 11
PHP
8/7/2019 Crear plantillas Joomla
12/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 12
En el DIV 'header' se carg una etiqueta H1 que muestra el nombre del sitio. Por otro lado, enel footer se carga el archivo footer.php que trae un texto predeterminado para mostrar. Este seencuentra en includes/footer.php
Si en el backend, configuramos para que nuestro template sea el predeterminado, al ingresar alsitio veremos:
Apariencia de nuestro template sin estilos
Lo cual no est mal, ya que an no hemos editado el CSS, por el contrario est muy bien,porque hemos podido cargar el contenido del sitio en nuestra plantilla.
Edicin de template.css
8/7/2019 Crear plantillas Joomla
13/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 13
Vamos a la carpeta 'css' y creamos el archivo template.css. Lo primero que haremos serinsertar los estilos para la maquetacin de la plantilla:
CSS
* {
padding: 0;
margin: 0;
}
body {
font-size: 62.5%;
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
color: #333;
background-color:white;
}
#contenedor {
margin: 0 auto;
width: 922px;
}
#header {
width: 900px;
float: left;padding: 10px;
margin: 10px 0px 5px 0px;
}
#navegacion {
float: left;
width: 900px;
padding: 10px;
margin: 0px 0px 5px 0px;
}
#izquierda {
margin: 0px 5px 5px 0px;
padding: 10px;
width: 195px;
float: left;}
#contenido{
float: left;
margin: 0px 5px 5px 0px;
padding: 10px;
width: 456px;
display: inline;
}
#derecha {
color: #333;
margin: 0px 0px 5px 0px;
padding: 10px;
width: 195px;
float: left;}
#footer {
width: 900px;
clear: both;
margin: 0px 0px 10px 0px;
padding: 10px;
}
8/7/2019 Crear plantillas Joomla
14/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 14
Apariencia de nuestro template con estilos de maquetacin
Ahora somos libres de aadir los estilos que queramos, pero para eso primero debemosconocer algunas de las clases que Joomla! carga por default en sus elementos.
8/7/2019 Crear plantillas Joomla
15/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 15
Clases pertenecientes a contenido
Clases CSS asociadas a un artculo
componentheading
Nuestra el ttulo del componente en cuestin. La pgina de inicio, al ser un componente(com_frontpage) tiene posibilidad de mostrar un ttulo.
contentheading
Es la clase perteneciente a la celda que muestra el ttulo de los artculos.
buttonheading
Pertece a las celdas que muestran los iconos de PDF, Imprimir y Enviar a un amigo.
small
Es usado por varios elementos, entre ellos el que muestra el autor de un artculo.
8/7/2019 Crear plantillas Joomla
16/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 16
createdate
Es usado por la celda que muestra la fecha de creacin de un artculo.
readon
Utilizada por el link "Leer ms..."
article_separator
Utilizada por la etiqueta que separa a los artculos entre s.
Clases pertenecientes a mdulos
Por lo general, las clases asociadas a mdulos dependen de varias cosas, desde la forma en
que nosotros seleccionamos el estilo de carga del mdulo, hasta si esta posee un sufijo de laclase de mdulo. Adems muchos mdulos creados por terceros poseen sus propias clasespropias.
Tomemos como ejemplo, un mdulo del tipo men:
Clases CSS asociadas a un mdulo del tipo men
moduletable
Arriba contbamos que los mdulos pueden cargarse de diferentes formas, dentro de tablas en DIVs. Para nuestro template nosotros hemos especificado que los mdulos se carguen enun solo DIV a travs del parmetro style="xhtml". Para este caso, el DIV contenedor posee laclase CSS asociada moduletableSi nosotros entramos a la edicin del mdulo, podremos aadir un sufijo especifico paramoduletable:
8/7/2019 Crear plantillas Joomla
17/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 17
Parmetro para aadir sufijo CSS
h3
Los ttulos de los mdulos se cargan con la etiqueta H3.
active
Para el caso del men, cuando nos encontramos dentro de una pgina existente como item, seagrega la clase active.
item
A su vez cada elemento del men posee una clase unica, la cual es item ms el ID que poseadicho elemento. Es importante esta clase cuando deseamos un diseo nico por cadaelemento del men.
parent
Si hemos creado un elemento que a su vez posee sub-items, al elemento padre se le aade laclase parent.
Otras clases CSS importantesbutton
Es una clase asociada a elementos del tipo botn.
inputbox
Suele estar asociada a elementos text-input.
pagenavClase asociada a la paginacin de artculos.
modifydate
Clase asociada a la fecha de modificacin de un artculo.
8/7/2019 Crear plantillas Joomla
18/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 18
sectiontableentry1 / sectiontableentry2
Suele estar asociada cuando se muestran datos en tablas.
Ahora que conocemos las clases mas importantes, podemos ir aplicando un poco de estilo altemplate y acomodar los mdulos que vamos a usar:
CSS
* {
padding: 0;
margin: 0;
}
body {
font-size: 62.5%;
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
color: #333;
}
#contenedor {
margin: 0 auto;
width: 922px;
}
#header {
width: 900px;
float: left;
padding: 10px;
margin: 10px 0px 5px 0px;
}
#navegacion {
float: left;
width: 900px;
padding: 10px;
margin: 0px 0px 5px 0px;
}
#izquierda {
margin: 0px 5px 5px 0px;
padding: 10px;
width: 195px;
float: left;
}
#contenido {
float: left;
margin: 0px 5px 5px 0px;
padding: 10px;
width: 456px;
display: inline;
}
#derecha {
color: #333;
margin: 0px 0px 5px 0px;
padding: 10px;width: 195px;
float: left;
}
#footer {
width: 900px;
clear: both;
margin: 0px 0px 10px 0px;
padding: 10px;
}
/* Color
--------------------------------------------------------- */
8/7/2019 Crear plantillas Joomla
19/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 19
a{
text-decoration:none;
color:#3B6EA5;
}
#header a {
font-size:1.8em;
margin-left:230px;
color:#3B6EA5;
}
/* Elementos
--------------------------------------------------------- */
a:hover {
color: #147;
text-decoration: underline;
}
a img{
border:0px;
}
h1, h2, h3 {
font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-weight: bold;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.6em;
}
h3 {
font-size: 1.3em;
}
h1, h1 a, h1 a:hover, h1 a:visited, .description {
text-decoration: none;
}
h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
color: #333;
}
h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited{
text-decoration: none;
}
/* Modulos
--------------------------------------------------------- */
#izquierda .moduletable_menu{
text-align:right;
margin-bottom:15px;
}
#derecha .moduletable_menu, #derecha .moduletable{
text-align:left;
margin-bottom:15px;}
#izquierda .moduletable_menu li{
margin:3px 0 0;
padding:0;
list-style-image:none;
list-style-type:none;
}
#izquierda .moduletable_menu li:before{
content: "\00BB \0020";
}
8/7/2019 Crear plantillas Joomla
20/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 20
.moduletable_menu h3, .moduletable h3, .moduletable_text h3{
margin:5px 0 0;
padding:0;
text-transform:uppercase;
}
/* Contenido
--------------------------------------------------------- */
.contentheading {
font-size:1.4em;
margin:0;
color:#333333;
font-weight:bold;
}
.contentheading:hover {
color:#3B6EA5;
}
.componentheading{
font-size:1.4em;
margin:0;
color:#777777;
font-weight:bold;
padding-left:10px;
}
.contentpaneopen{
line-height:1.4em;
font-size:1.2em;
text-align:left;
padding: 0px 10px 0px 10px;
}
.contentpaneopen img{
padding: 5px 10px;
}
.readon{
font-size:0.8em;
text-align:left;
}
.contenttoc, .pagenavcounter{
margin-bottom:10px;
}
.article_separator{
display:block;
background:#474747;
height:1px;
margin:10px 60px 10px 10px;
}
small , .createdate, .modifydate{
font-family:Arial,Helvetica,Sans-Serif;
font-size:0.9em;
line-height:1.5em;
color:#777777;
padding-bottom:10px;
}
.banneritem_text, .bannerfooter_text{padding:5px;
}
/* Menu superior
--------------------------------------------------------- */
#navegacion #mainlevel-nav{
list-style:none;
position:relative;
padding:0px;
float:left;
padding-left:100px;
}
8/7/2019 Crear plantillas Joomla
21/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 21
#navegacion #mainlevel-nav li {
float:left;
height:20px;
}
#navegacion #mainlevel-nav li a {
float:left;
text-decoration:none;
margin:0px;
padding-right:10px;
}
#navegacion #mainlevel-nav li a:hover {
text-decoration:underline;
}
#navegacion #mainlevel-nav li a:before{
content: "\00BB \0020";
}
Template con diseo
El diseo est basado en White as Milkhttp://azeemazeez.com/misc/whiteasmilk/, templatepara Wordpress, creado por Azeem Azeez http://www.azeemazeez.com/blogs/white-as-milk/
8/7/2019 Crear plantillas Joomla
22/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 22
Manejo de parmetros en la plantilla
Como vimos al principio, los parmetros de un template se deben especificar entemplateDetails.xml. All se debe poner el tipo de parmetro, las opciones que posee y cual esel parmetro por default. A su vez, los valores de los parmetros son guardados en el archivoparams.ini que como vimos, se encuentra en la carpeta de la plantilla.
Veamos por ejemplo, la util izacin de parmetros para cambiar el color de la tipografa deltemplate. En templateDetails.xml nosotros ya hemos especificado la opcin. Lo siguiente sercrear un archivo params.ini con el valor por default que debe tener el parmetro, en este casoqueremos que el color predeterminado de la tipografa sea azul:
color=azul
En caso de tener ms parmetros, estos deben ir uno por l nea con su correspondiente valor:
nombre_del_parametro_1=valor
nombre_del_parametro_2=valor
nombre_del_parametro_3=valor
Lo siguiente ser ir al index.php y agregar la directiva que llamar al valor del parmetro. Estevalor lo utilizaremos para crear un identificador CSS y as especificar cuando cargar un color ycuando otro. Entonces en el index.php, en la etiqueta agregamos:
PHP
8/7/2019 Crear plantillas Joomla
23/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 23
Si seleccionamos como valor rojo:
HTML
Nos quedara modificar el CSS del template para que dependiendo del identificador, secambien los colores. En el apartado Color podemos poner:
CSS
/* Color
--------------------------------------------------------- */
#header a {
font-size:1.8em;
margin-left:230px;
}
a{
text-decoration:none;}
#azul a{
color:#3B6EA5;
}
#azul #header a {
color:#3B6EA5;
}
#verde a{
color:#59AC03;
}
#verde #header a {
color:#59AC03;}
#rojo a{
color:#FF3131;
}
#rojo #header a {
color:#FF3131;
}
Entrando a la configuracin del template podremos cambiar el color de la tipografa.
8/7/2019 Crear plantillas Joomla
24/25
Este documento se distribuye bajo la licencia Creative Commons Atribucin-No Comercial 2.5 24
Diferentes colores utilizando parmetros
Creacin de template_thumbnail.png
Lo ltimo que nos quedara para terminar nuestro template bsico, es la creacintemplate_thumbnail.png, la imagen que actuar a modo de previsualizacin del template en elback-end del sitio. No est establecido el tamao estndar de la imagen, pero por lo general esde 200px de ancho y 150px de alto.
Apuntes finales
Si deseamos crear un instalador de nuestro template, recordemos de especificar entemplateDetails.xml todos los archivos que se utilizaron. Esto es importante ya que sino lo hacemos, al momento de subir el instalador Joomla! nos entregar un mensaje deerror.
Una forma fcil para descubrir las diferentes clases asociadas que genera el output deJoomla! es utilizando Firebughttp://getfirebug.com , una extensin para Firefox quepermite inspeccionar el DOM de un sitio y visualizar como est conformado.
En la web podemos encontrar varios recursos para continuar con el aprendizaje de lacreacin de templates para Joomla!, el ms importante se encuentra en la
documentacin oficial del proyecto: Template reference materialhttp://docs.joomla.org/Template_reference_material
No nos olvidemos de Mootools! En su pgina oficial http://mootools.net se puedeencontrar documentacin y ejemplos para aadir efectos a la plantilla.
Por seguridad, es conveniente crear un archivo index.html sin contenido y alojarlo en lacarpeta de nuestro template y subcarpetas.
8/7/2019 Crear plantillas Joomla
25/25
Recursos para el futuro
Tanto si ests interesado en desarrollar sitios para terceros, como si lo ests en desarrollarsitios para t, tras este manual paso a paso, te queda todo un mundo abierto de posibilidades yde recursos para seguir profundizando y adquiriendo mayor experiencia con Joomla!
Si te decides a trabajar ms con Joomla!, estos enlaces generales pueden ayudarte en tusvenideros desarrollos:
http://forum.joomla.org Regstrate, busca y pregunta. Siempre ayuda a otros si te esposible!
http://help.joomla.org Encuentra ms y ms documentacin.
http://extensions.joomla.org Encuentra un montn de extensiones!.
http://www.joomla.org Estate al da y !encuentra el modo de devolver tu gratitud a lacomunidad en la medida de tus posibilidades!
http://www.comunidadjoomla.org Vistanos y participa con nosotros si te apetece!,aparte de adaptar guas y otro material de ayuda para Joomla! del ingls al espaol,dedicamos nuestras energas a:
o Mantener y actualizar los packs de Joomla! en nuestro idioma.o Generar material de ayuda en nuestro idioma para Joomla!o Traducir noticias Joomla! del ingls al espaolo Traducir extensiones para Joomla! que sean GNU/GPLo Dar soporte para Joomla!, en nuestro idioma, desde nuestro Foro
http://foro.comunidadjoomla.org/o Tenemos una wiki para documentacino Y un blog para charlar sobre temas de inters!
Todo esto y algunas cosas ms, con el objetivo principal de fomentar y promover lacolaboracin entre usuarios, sin nimo de lucro; brindando el espacio y un entorno apropiadoque lo permitan, a travs de nuestro proyecto Comunidad Joomla!.
Top Related