Drupal Theming
Themes Control del diseño HTML, CSS, imágenes, Javascript, etc.
Drupal Theming Apariencia : Photoshop, Illustrator, Fireworks, etc. Hojas de estilo (CSS) Adaptar HTML generado por drupal
3 pasos 1. Info Files (.info) 2. Template Files (.tpl.php) 3. Adaptar funciones
Estructura Theme
1. Info File 2. Template Files.tlp.php 3. Funciones y variables.
Primer Paso:.Info File Nombre y descripción Screenshot ó imagen Core (Versión Drupal) CSS Regiones Features Características
Nombre y descripción name = Drupal México description = Theme elaborado en el taller de Drupal
Screenshot screenshot = images/screenshot.png
Core core = 6.x base theme = zen
CSS stylesheets[all][] = styles.css
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
Características features[] = logo features[] = name features[] = slogan
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
Templates Básicos Page.tpl.php
Templates Básicos block.tpl.php
Templates Básicos node.tpl.php
Templates Básicos box.tpl.php
Templates Básicos comment.tpl.ph p
Templates dinámicos Duplicar node.tpl.php Reenombrar node-nodetype.tpl.php node- blog.tpl.php
Templates dinámicos Front disponible en Drupal 6.-x
Templates dinámicos
Importante! Copiar desde el Core al Theme
Templates dinámicos
3 Paso: Funciones template.tpl.php Consultar API Drupal
Zen & 960.gs
¿Que demonios es Zen? Theme Framework
Zen Garden
960.gs CSS Framework Basado en grid de 12 y 16 columnas
960.gs Clases CSS container grid prefix suffix alpha omega
960.gs ejemplos CONTENIDO
960.gs Area disponible 940 px Padding 10 px por lado