DISEÑAR EN JOOMLA!
¿QUÉ ES UNA PLANTILLA“Es una serie de archivos que controlan la presentación del         contenido en un sitio que utiliza...
ELEMENTOS DE UNA                   PLANTILLA•   index.php    •   Código para manipulación de        datos•   template.css ...
CÓMO SE MANEJA EL           CONTENIDO• Componentes •1   por página, generalmente en la parte central• Módulos • Varios   p...
CREANDO UNA PLANTILLA
PASO 1: CREAR UN HTML Y        CSS BASE(utilizando las carpetas de Joomla! para una plantilla)
PASO 2: INSTALAR LAPLANTILLA BASE EN JOOMLA!
PLANTILLA BASE EN JOOMLA!1.Instalar Joomla!2.Crear la carpeta en templates, con los archivos requeridos3.Cambiar el HTML b...
PASO 3: INTRODUCIR LAS   POSICIONES EN LA      PLANTILLA
PASO 4: CSSReferencia: http://www.nosolocodigo.com/css-cheatsheet-                    para-joomla-15
CSS DEL CONTENIDO    PRINCIPAL EN JOOMLA! 1.5• Título      de componente:      • Contenido                                ...
CSS DEL CONTENIDO   PRINCIPAL EN JOOMLA ! 1.6• Título   de componente: h1   • Información:                                ...
MENÚ EN 1.5 Y 1.6• div.moduletable_menu• ul.menu• li(class=”active” si está  activo)
MÓDULOS EN 1.5 Y 1.6• div.moduletable• Título: h3• Elementos: ul   / li
Upcoming SlideShare
Loading in …5
×

Diseñar en joomla!.key

1,445 views
1,375 views

Published on

Diseñar en Joomla!, por Augusot Alvarez
Presentación 2 de Abril de 2011, Taller Joomla! para Universidad Galileo

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,445
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
23
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • \n
  • Expectativa del cliente escogido: Cultura Android Guatemala\nEn este punto, mostrar la el template base (template.html) de la carpeta 01 - Maquetación Base\nMostrar las posiciones de módulos y componentes que se configurarán\n
  • \n
  • \n
  • \n
  • Expectativa del cliente escogido: Cultura Android Guatemala\nEn este punto, mostrar la el template base (template.html) de la carpeta 01 - Maquetación Base\nMostrar las posiciones de módulos y componentes que se configurarán\n
  • No es necesario mostrar nada\n
  • Mostrar la carpeta y el archivo XML generado (02 - base Joomla! / 1.5)\nMostrar el Template manager antes de subir la carpeta\nSubir la carpeta y aplicar la plantilla, mostrar el resultado final\n
  • Introducir las posiciones menu, right y footer, así como el contenido (component)\nResultado final como “03 - Posiciones” (1.5 y 1.6 respectivamente)\nTips necesarios: hablar de la configuración de los artículos\n
  • \n
  • Resultado final como “04 - CSS Contenido” / 1.5\n\n
  • Resultado final como “04 - CSS Contenido” / 1.6\nNotar diferencias entre tablas 1.5 y divs 1.6\n
  • Resultado final como “05 - CSS Menús” / (1.5 y 1.6)\n\n
  • Resultado final como “06 - CSS Módulos” / (1.5 y 1.6)\n\n
  • Diseñar en joomla!.key

    1. 1. DISEÑAR EN JOOMLA!
    2. 2. ¿QUÉ ES UNA PLANTILLA“Es una serie de archivos que controlan la presentación del contenido en un sitio que utiliza Joomla” Barrie North CompassDesigns.net
    3. 3. ELEMENTOS DE UNA PLANTILLA• index.php • Código para manipulación de datos• template.css • Reglas para manipular la visualización de los datos• TemplateDetails.xml • Instalación y datos en Backend
    4. 4. CÓMO SE MANEJA EL CONTENIDO• Componentes •1 por página, generalmente en la parte central• Módulos • Varios por página, en “posiciones” de plantilla• Plugin • Varios, manipulan el comportamiento del contenido
    5. 5. CREANDO UNA PLANTILLA
    6. 6. PASO 1: CREAR UN HTML Y CSS BASE(utilizando las carpetas de Joomla! para una plantilla)
    7. 7. PASO 2: INSTALAR LAPLANTILLA BASE EN JOOMLA!
    8. 8. PLANTILLA BASE EN JOOMLA!1.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
    9. 9. PASO 3: INTRODUCIR LAS POSICIONES EN LA PLANTILLA
    10. 10. PASO 4: CSSReferencia: http://www.nosolocodigo.com/css-cheatsheet- para-joomla-15
    11. 11. CSS DEL CONTENIDO PRINCIPAL EN JOOMLA! 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
    12. 12. CSS DEL CONTENIDO PRINCIPAL EN JOOMLA ! 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
    13. 13. MENÚ EN 1.5 Y 1.6• div.moduletable_menu• ul.menu• li(class=”active” si está activo)
    14. 14. MÓDULOS EN 1.5 Y 1.6• div.moduletable• Título: h3• Elementos: ul / li

    ×