Hosting Joomla - Alojamiento para Joomla, blog y vídeos Joomla

NEW YORK +1.888.815.4203 BARCELONA +34.902.009.386
Domingo, 18 de Septiembre de 2011 01:51

Estilos de módulos en templates por defecto de Joomla 1.7

por  Jhon Marreros Guzmán
Vota este articulo
(4 votos)
icoestilosmodulostemplatej17Joomla 1.7 viene con dos templates por defecto para el front-end beez5 y beez20 (adicionalmente tiene el template atomic para trabajar como base para una nueva plantilla).

Los templates por defecto tienen implementado algunos estilos de módulos, estilos de tabs y estilos desplegables, los cuales nos pueden servir para dar un aspecto visual más atractivo a nuestro sitio web.

En este artículo veremos cómo trabajar con estos estilos de módulos, además veremos en que lugar del código se implementan y a que posiciones obedecen.

 

1- Trabajando con los templates

Primero necesitamos habilitar la funcionalidad en Joomla 1.7 para ver las posiciones de la plantilla, esto se logra desde el backend de Joomla, extensiones => gestor de plantilla => opciones, tal como se muestra en la siguiente imagen.

img1

 

2-Localizando los estilos de módulos en las posiciones

Luego localizamos las posiciones de nuestro template colocando ?tp=1 al final de la url (&tp=1 si ya tiene parámetros), por ejemplo para el template beez20 tenemos que la position-4 y position-5 se encuentra en la parte izquierda.

img2

Vemos que para la posición 4 tenemos el estilo beezHide y para la posición 5 el estilo beeztabs

 

3- Cambiando las posiciones de los módulos

Si deseamos mostrar un determinado módulo como desplegable debemos colocarlo en la posicion 4 (position-4) , si deseamos verlo como tab, debemos colocarlo en la posición 5 (position-5), tal como se muestra en la siguiente imagen.

img3

 

4- Revisando el código

El código de los estilos de los módulos se encuentra en el archivo principal de la plantilla, archivo index.php.

<jdoc:include type="modules" name="position-4" style="beezHide" headerLevel="3" state="0 " />
<jdoc:include type="modules" name="position-5" style="beezTabs" headerLevel="2"  id="3" />

Como se puede observar la position-4 hace referencia a beezHide y la position-5 a beezTabs.

 

5- Resultado final

Después de haber hecho las modificaciones para el módulo por defecto de : "sobre joomla" y "este sitio", veremos las siguientes variaciones.

 

Módulos en position-4

imgfinal1

Módulos en position-5

imgfinal2

 

En el siguiente video se explica de manera práctica cada uno de los puntos explicados anteriormente.

 

Ultima modificacion el Domingo, 18 de Septiembre de 2011 02:20

¡Descubre nuestros Packs!


Pack Tienda Joomla

Pack Empresa Joomla

Pack Periódico o Revista Joomla

Testimonios de Clientes

Buscador Joomla

Cargando...

Webempresa en Facebook

Quieres estar al día en Joomla?
Haz clic en "Me gusta"


Canales Webempresa

Twitter_Facebook_Youtube_Feed_

Notícias Joomla en tu Email

noticias Joomla
Suscríbete Ahora!
Código:
Joomla : Hosting Joomla - Alo

Artículos en tu lector RSS

Suscríbete a nuestro Feed RSS

Servicios que ofrecemos para Joomla :
Hosting JoomlaHosting Joomla
Servidores Joomla especializados.
Soporte Joomla 24x7x365
hosting_joomla Reseller Joomla
Especial para Diseñadores Joomla. Olvídate del Hosting de tus Clientes
ayuda JoomlaAprende Joomla
Formación en Joomla 2.5, Virtuemart 2.0 y de las extensiones más populares
Desarrollo JoomlaPacks Joomla
Múltiples diseños profesionales.
Tu Web Joomla por 299€