Este módulo trata sobre cómo personalizar la apariencia de un sitio web creado con Drupal. Explica cómo usar módulos para mejorar el aspecto visual, los conceptos básicos de creación de temas en Drupal como CSS, plantillas y funciones, y cómo configurar el entorno de desarrollo. También incluye una práctica para crear un museo virtual usando el módulo Panels.

1. MÓDULO 6
Configurar el aspecto visual de la web.
Theming con Drupal

2. MÓDULO 6:
Theming con Drupal
Índice:
1. Introducción
2. Módulos que mejoran el aspecto visual
3. Css, Plantillas y Funciones
4. Entorno Drupal

3. MÓDULO 6:
Theming con Drupal
Introducción:
En este módulo se pretende hacer una
introducción al theming con drupal.
Se presentarán módulos que nos ayuden a la
mejora visual de la página web.
Se mostrarán los elementos básicos de un tema
de Drupal.
Se presentarán las herramientas necesarias para
la creación de temas.

4. MÓDULO 6:
Theming con Drupal
Módulos :
• Vertical tabs.
• Tabs+ Cckfieldgrouptabs.
• Homebox.
• Nice Menús, Superfish Menu.
• Panels.

5. MÓDULO 6:
Theming con Drupal
Práctica:
Museo con Panels

6. MÓDULO 6:
Theming con Drupal
Algunas definiciones :
• Tema: Conjunto de archivos relacionados entre sí que son
responsables de controlar el aspecto visual de una página
web.
• Motor de temas (theme engine): Colección de ficheros y
scripts que interpretan el lenguage de programación
utilizado y lo procesan presentándolo en un formato
determinado.
• Región: Lugar dentro de la distribución de la pagina donde
podemos poner contenido. Por ejemplo, bloques.

7. MÓDULO 6:
Theming con Drupal
Cómo muestra Drupal el contenido :
Pagina web
Estilo final y disposición del
contenido
Tema
Formateo inicial
Motor del tema
Manipulacion del contenido
Drupal Core
Contenido sin formatear de
Contenido la BD

8. MÓDULO 6:
Theming con Drupal
Extesiones de un tema :
• .info: Archivo de configuración del Tema. Podríamos decir
que es un archivo similiar a los .INI
• .tpl.php: Extensión utilizada por el sistema de plantillas
PHPTemplate.
• .css: Hojas de estilos.
Nombre_tema.info + Page.tpl.php + Style.css
Tema

9. MÓDULO 6:
Theming con Drupal
Fichero .info:
Archivo con entradas del tipo clave = valor
• Comentarios con “;”
• Claves:
• name • regions
• description • features
• screenshot • stylesheets
• version • scripts
• core • php
• engine
• base theme

10. MÓDULO 6:
Theming con Drupal
Interceptar y redefinir : Css
Hoja de
estilos del
Style.css tema activo
Hojas de
CSS CSS CSS CSS estilos de los
modulos

11. MÓDULO 6:
Theming con Drupal
Plantillas y Funciones:
• Herramientas a utilizar:
• Devel.
• Theme Developer.
• Firebug.
Todas las plantillas y funciones pueden
ser sobreescritas

12. MÓDULO 6:
Theming con Drupal
Sustitución de plantillas:
Copiar la plantilla Pegarla en el directorio del tema
(respetando el nombre)
Limpiar el registro del Hacer los cambios y
tema guardar
Administración | Configuración del sitio | Rendimiento
Limpiar datos de la cache

13. MÓDULO 6:
Theming con Drupal
Redefinir plantillas: Utilización de sugerencias
Page-node-x.tpl.php
Page-node.tpl.php
Page.tpl.php
Las sugerencias sólo funcionan si se encuentran en el mismo
directorio que la plantilla base

14. MÓDULO 6:
Theming con Drupal
Redefinir funcines: template.php
Crear fichero template.php Buscar la función a redefinir
Renombrar Copiar la función
Realizar cambios Limpiar cache

15. MÓDULO 6:
Theming con Drupal
Nomenclatura de las funciones
• Nombre base: theme_nombrefuncion();
• theme_breadcrumb();
• Posibles nombres:
• nombretema_nombrefuncion (); garland_breadcrumb();
• nombremotorplantilla_nombrefuncion(); phptemplate_breadcrumb();
• nombre base.

16. MÓDULO 6:
Theming con Drupal
Redefinir funcines: Plantillas dedicadas
Crear fichero .tpl.php Renombrar fichero
Copiar la función Buscar la función a redefinir
Realizar cambios Limpiar cache
Theme_coment_view Coment-view.tpl.php

17. MÓDULO 6:
Theming con Drupal
Práctica:
Museo con Panels,
plantillas, funciones y css

18. MÓDULO 6:
Theming con Drupal
RESUMEN:
En este módulo hemos aprendido a:
• Instalar módulos que mejoran el aspecto visual.
• Los principios básicos de “theming con drupal”.