Diseñar en joomla!.key
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Diseñar en joomla!.key

on

  • 1,202 views

Diseñar en Joomla!, por Augusot Alvarez

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

Statistics

Views

Total Views
1,202
Views on SlideShare
1,197
Embed Views
5

Actions

Likes
0
Downloads
21
Comments
0

2 Embeds 5

http://www.joomlagt.org 4
http://joomlagt.org 1

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \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 Presentation Transcript

  • 1. DISEÑAR EN JOOMLA!
  • 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. 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. 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. CREANDO UNA PLANTILLA
  • 6. PASO 1: CREAR UN HTML Y CSS BASE(utilizando las carpetas de Joomla! para una plantilla)
  • 7. PASO 2: INSTALAR LAPLANTILLA BASE EN JOOMLA!
  • 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. PASO 3: INTRODUCIR LAS POSICIONES EN LA PLANTILLA
  • 10. PASO 4: CSSReferencia: http://www.nosolocodigo.com/css-cheatsheet- para-joomla-15
  • 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. 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. MENÚ EN 1.5 Y 1.6• div.moduletable_menu• ul.menu• li(class=”active” si está activo)
  • 14. MÓDULOS EN 1.5 Y 1.6• div.moduletable• Título: h3• Elementos: ul / li