Si no ves el video, puedes refrescar el navegador, presionando (Ctrl+Shift+R | Ctrl+F5 o Shift+F5), o abrirlo directamente desde el Canal de Youtube... HAZ CLIC AQUI
Entre los módulos más utilizados y potentes con los que cuenta Drupal, por defecto a partir de Drupal 8, el el módulo Views o Vistas, que nos permite crear consultas de todo tipo, através de su interfaz de usario.
Ya hemos explicado varias de las maneras de configuración de vistas en anteriores capítulos, pero hoy nos concentraremos en la manera de reescribir los resultados que se muestran, para que podamos darle un aspecto específico, manteniendo el control de su aspecto y de la manera en que se presentarán los datos.
Si quieres aprender más sobre el uso de las vistas HAZ CLIC AQUÍ
Cómo personalizar la plantilla para una vista
Paso 1 - Crear un tema personalizado
Para que Drupal reconozca nuestras plantillas, tendremos que crear un tema personalizado. Para ello podremos elegir entre varias opciónes:
Subtema basado en Radix, HAZ CLIC AQUI
Subtema basado en Bootstrap 3, HAZ CLIC AQUI
Subtema basado en Boostrap Barrio, HAZ CLIC AQUÍ
Cómo crear un Subtema basándonos en Bartik o cualquier otro tema del Core de Drupal
Si queremos crear un subtema, de la forma más sencilla, podremos utilizar cualquiera de los que trae Drupal por defecto, por ejemplo el Tema Bartik. Para crear un subtema, basándonos en cualquiera de los del core, sigue estos pasos:
1.- Colócate en la carpeta themes, a continuación, añade una carpeta custom, donde deberás alojar cualquiera de tus temas personalizados. Luego, dentro de ella, crea una nueva carpeta con el nombre de tu Subtema.
2.- Dentro de la carpeta de tu Subtema, crear un archivo, con el mismo nombre de tu carpeta, terminado en .info.yml, es decir, si tu Subtema se llama mitema, entonces, crearás un archivo llamado mitema.info.yml y a continuación, copia y pega el siguiente código dentro de él.
name: Subtema Bartik description: Subtema creado a partir de Bartik type: theme core_version_requirement: ^8 || ^9 base theme: bartik
3.- Finalmente Actívalo desde la interfaz de Drupal, para que sea tu tema por defecto. Para tus plantillas, añadirás, una carperta Templates y si quieres que tenga el mismo logo de Drupal, como en este ejemplo, sólo tendrás que copiarlos desde el Tema Padre.
- También puedes activar el tema y configurarlo como tema por defecto, a través de la consola, ejecutando el siguiente comando de Drush:
drush config-set system.theme default Subtheme_name -y
Paso 2 - Activar el modo Debug o Depurador
Si vamos a trabajar con archivos de Drupal, en este caso, con las plantillas Twig, tendremos que conocer el nombre de la o las plantillas que afectan al contenido que vamos a modificar. Para ello, activaremos el modo depurado de Drupal, que nos permitirá conocer la ubicación de las Plantillas Modelo, así como el nombre que tendremos que ponerle, en caso de querer modificar un tipo de contenido, un bloque, una vista, etc.
Para saber cómo activar el Modo Depurador o Debug, HAZ CLIC AQUÍ
Paso 3 - Crear la vista que vamos a modificar
Cuando trabajas con vistas, podrás decidir varias maneras de mostrar sus contenidos y de acuerdo con la opción que elijas, tendrás que utilizar la plantilla relacionada con el tipo de contenido, o la plantilla que afecta directamente el tipo de vista con el que haz decidido trabajar.
En este artículo trabajaremos con el tipo de contenido Factura, un tipo de contenido con varios campos de texto, fechas y un campo imagen, para que sea más gráfico el ejemplo.
Así que seleccionaremos el tipo de contenido que vamos a mostar y, a continuación, en el selector para elegir nuestra vista, seleccionaremos "Campos", de esta forma, podremos trabajar directamente con la plantilla llamada views-view-fields.html.twig.
Paso 4 - Confirmar las sugerencias de plantillas
Cuando hayas activado el Modo Debug o depurador, tendrás que borrar la cache de Drupal y te recomiendo actualizar la base de datos; para ello, podrás utilizar la interfaz o los comando de Drush:
drush cr drush updb
A continuación, podrás comprobar las sugerencias para los nombres de las plantillas, haciendo clic derecho y seleccionando Explorar, o presionando la tecla F12; el resultado será algo parecido a lo siguiente:
