Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Convertir html y css en j!

2,000 views

Published on

Convertir html y css en una plantilla de Joomla! 3 de 5 Taller de Creación de plantillas de Joomla! impartido el 28 de febrero 2010 por el Grupo de Usuarios de Joomla! Guatemala

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Convertir html y css en j!

  1. 1. CONVERTIR HTML Y CSS EN UNA PLANTILLA JOOMLA! Joomla! 1.5 y 1.6
  2. 2. PASO 1: CREAR UN HTML Y CSS BASE(utilizando las carpetas de Joomla! para una plantilla)
  3. 3. PASO 2: INSTALAR LAPLANTILLA BASE EN JOOMLA!
  4. 4. PLANTILLA BASE EN JOOMLA! 1.51.Instalar Joomla!2.Crear la carpeta en templates, con los archivos requeridos3.Cambiar el HTML base a index.php dejando las variables de Joomla!4.Aplicar la plantilla en Extensions / Template manager
  5. 5. PLANTILLA BASE EN JOOMLA! 1.61.Instalar Joomla!2.Cambiar el HTML base a index.php dejando las variables de Joomla!3.Crear la estructura base de la carpeta (incluyendo el XML) y guardarla en un ZIP4.Instalar la plantilla en Extensions / Extension manager (sólo la primera vez es necesario instalar)5.Aplicar la plantilla en Extensions / Template manager
  6. 6. PASO 3: INTRODUCIR LAS POSICIONES EN LA PLANTILLA
  7. 7. PASO 4: CSSReferencia: http://www.nosolocodigo.com/css-cheatsheet- para-joomla-15
  8. 8. CSS DEL CONTENIDO PRINCIPAL EN 1.5• Título de componente: • Contenido de artículo: div.componentheadin table.contentpaneope g n• Contenido: table.blog • Autor: span.small• Título de artículo: • Fecha: td.createdate td.contentheading
  9. 9. CSS DEL CONTENIDO PRINCIPAL EN 1.6• Título de componente: h1 • Información: dl.article-info• Contenido: div.blog • dt.article-info-term• Título de artículo: h2 • dd.category-name • dd.published • dd.createdby
  10. 10. MENÚ EN 1.5 Y 1.6• div.moduletable_menu• ul.menu• li(class=”active” si está activo)
  11. 11. MÓDULOS EN 1.5 Y 1.6• div.moduletable• Título: h3• Elementos: ul / li

×