Guías rápidas de Drupal 10 para desarrolladores
En esta guía rápida, aprenderás a crear un tema personalizado en Drupal 10 desde cero. Nos enfocaremos en los aspectos fundamentales para diseñar y desarrollar un tema que se ajuste a las necesidades específicas de tu proyecto, explorando el uso de plantillas Twig, la estructura de archivos y directorios, y las prácticas recomendadas para añadir y gestionar estilos y scripts. Este proceso te permitirá darle a tu sitio una identidad visual única, optimizando tanto la funcionalidad como la experiencia del usuario.
Sesiones:
- Sesión 1: introducción a la creación de temas en Drupal
- Objetivo: Familiarizarse con la estructura básica de un tema en Drupal 10.
- Contenido: Componentes esenciales de un tema de Drupal, cómo funcionan y qué elementos se pueden personalizar.
- Tareas: Crear una carpeta de tema personalizada y un archivo .info.yml para iniciar el tema.
- Sesión 2: estructura de archivos de un tema en Drupal
- Objetivo: Conocer la estructura de archivos y carpetas de un tema.
- Contenido: Ubicación y función de cada archivo (CSS, JavaScript, Twig, configuración).
- Tareas: Organizar el tema en carpetas adecuadas y configurar los archivos base.
- Sesión 3: plantillas Twig y estructura HTML
- Objetivo: Aprender a trabajar con plantillas Twig para personalizar la estructura HTML del sitio.
- Contenido: Cómo funcionan las plantillas Twig y cómo Drupal las utiliza para renderizar elementos.
- Tareas: Crear una plantilla Twig y modificar la estructura de una página.
- Sesión 4: sobreescritura de plantillas Twig
- Objetivo: Personalizar aún más el sitio sobreescribiendo plantillas Twig específicas.
- Contenido: Estrategias para identificar y sobrescribir plantillas predeterminadas en Drupal.
- Tareas: Sobrescribir una plantilla de nodo o bloque y adaptar su contenido.
- Sesión 5: personalización de estilos con CSS
- Objetivo: Integrar archivos CSS en el tema y personalizar el diseño visual.
- Contenido: Configuración de CSS en el tema, buenas prácticas de organización de estilos.
- Tareas: Crear un archivo CSS, integrarlo en el tema y personalizar elementos de diseño.
- Sesión 6: inclusión de JavaScript en el tema
- Objetivo: Añadir funcionalidades interactivas mediante JavaScript.
- Contenido: Cómo añadir archivos JavaScript y optimizar su rendimiento.
- Tareas: Crear un archivo JavaScript, incluirlo en el tema y añadir funcionalidad básica.
- Sesión 7: configuración de bibliotecas en Drupal
- Objetivo: Organizar CSS y JavaScript en bibliotecas para su uso en distintas páginas.
- Contenido: Uso de bibliotecas en Drupal para cargar archivos de manera eficiente.
- Tareas: Crear una biblioteca en el archivo .libraries.yml y vincular CSS y JavaScript según las necesidades del tema.
- Sesión 8: depuración y optimización del tema
- Objetivo: Mejorar el rendimiento y solucionar errores de diseño y funcionalidad.
- Contenido: Herramientas y técnicas para depurar el tema y optimizar recursos.
- Tareas: Activar herramientas de depuración y realizar pruebas para optimizar el tema.