La descarga está en progreso. Por favor, espere

La descarga está en progreso. Por favor, espere

Drupal Theming Themes Control del diseño HTML, CSS, imágenes, Javascript, etc.

Presentaciones similares


Presentación del tema: "Drupal Theming Themes Control del diseño HTML, CSS, imágenes, Javascript, etc."— Transcripción de la presentación:

1 Drupal Theming

2 Themes Control del diseño HTML, CSS, imágenes, Javascript, etc.

3 Drupal Theming Apariencia : Photoshop, Illustrator, Fireworks, etc. Hojas de estilo (CSS) Adaptar HTML generado por drupal

4 3 pasos 1. Info Files (.info) 2. Template Files (.tpl.php) 3. Adaptar funciones

5 Estructura Theme

6 1. Info File 2. Template Files.tlp.php 3. Funciones y variables.

7 Primer Paso:.Info File Nombre y descripción Screenshot ó imagen Core (Versión Drupal) CSS Regiones Features Características

8 Nombre y descripción name = Drupal México description = Theme elaborado en el taller de Drupal

9 Screenshot screenshot = images/screenshot.png

10 Core core = 6.x base theme = zen

11 CSS stylesheets[all][] = styles.css

12 Definir Regiones regions[left] = left sidebar regions[right] = right sidebar regions[navbar] = navigation bar regions[content_top] = content top regions[header] = header regions[footer] = footer

13 Características features[] = logo features[] = name features[] = slogan

14 2 paso : Template Files (.tpl.php) Existen 5 templates básicos Page.tpl.php block.tpl.php node.tpl.php box.tpl.php comment.tpl.php

15 Templates Básicos Page.tpl.php

16 Templates Básicos block.tpl.php

17 Templates Básicos node.tpl.php

18 Templates Básicos box.tpl.php

19 Templates Básicos comment.tpl.ph p

20 Templates dinámicos Duplicar node.tpl.php Reenombrar node-nodetype.tpl.php node- blog.tpl.php

21 Templates dinámicos Front disponible en Drupal 6.-x

22 Templates dinámicos

23 Importante! Copiar desde el Core al Theme

24 Templates dinámicos

25 3 Paso: Funciones template.tpl.php Consultar API Drupal

26 Zen & 960.gs

27 ¿Que demonios es Zen? Theme Framework

28 Zen Garden

29 960.gs CSS Framework Basado en grid de 12 y 16 columnas

30 960.gs Clases CSS container grid prefix suffix alpha omega

31 960.gs ejemplos CONTENIDO

32 960.gs Area disponible 940 px Padding 10 px por lado


Descargar ppt "Drupal Theming Themes Control del diseño HTML, CSS, imágenes, Javascript, etc."

Presentaciones similares


Anuncios Google