Se apri il file del template page.html.twig del tema Stable:
/core/themes/stable/templates/layout/page.html.twig
Noterai che differisce dal template page.tpl.php di Drupal 7, innanzitutto per l’estensione e, in secondo luogo, per la grande quantità di parentesi graffe {}. Questo accade perché Drupal utilizza il motore di template Twig.
Nei tutorial precedenti abbiamo già collegato i file CSS al nostro tema. Per farlo, abbiamo indicato nel file drupalbook.info.yml quanto segue:
libraries:
- drupalbook/global-styling
Successivamente, abbiamo creato il file drupalbook.libraries.yml, dove abbiamo specificato quale file CSS includere:
Abbiamo già visto che in Drupal è integrato Twig e come utilizzarlo. In questo articolo analizzeremo come lavorare con i template di Drupal, quali template si trovano nel tema Stable, come sovrascriverli e come ridefinire i template di varie entità di Drupal.
Iniziamo con i template del tema Stable. Apri la cartella templates del tema Stable:
Per creare una nuova regione attraverso la quale poter visualizzare blocchi, devi eseguire due passaggi:
- Aggiungere le informazioni della regione al file
theme.info.yml - Modificare il file
page.html.twigaggiungendo l’output della nuova regione
Aggiungere i dati della regione al file drupalbook.info.yml
Tutte le regioni vengono definite all’interno della chiave regions:
Per iniziare, vediamo come includere file JavaScript personalizzati nel nostro tema.
Nel file .libraries.yml dobbiamo aggiungere il riferimento al nostro file js:
Molto spesso il template predefinito di Views non è adatto alle nostre esigenze, quindi possiamo sovrascrivere i template di Views. Sfortunatamente, Views non fornisce un’interfaccia grafica per cercare il template desiderato, ma possiamo usare i pattern per ridefinire i template.
Puoi leggere di più sui pattern in questo articolo:
6.6. Lavorare con i template in Drupal. Cosa sono i template nel core di Drupal.
In particolare, ci interessa questa sezione:
Drupal non è solo un CMS, è una vera e propria piattaforma per lo sviluppo di applicazioni web. Se decidi di creare il tuo tema personalizzato, troverai diversi framework che ti aiuteranno in questo compito. In questo articolo analizzeremo i più popolari tra essi.
Bootstrap
Drupal ha pochissimi temi già pronti che siano al tempo stesso belli e funzionali. Tuttavia, Drupal si integra facilmente con tutte le librerie e i servizi di terze parti. Ad esempio, puoi creare il tuo tema basato su Bootstrap e sfruttare tutta la potenza di Drupal. In questa sezione del sito drupalbook.org vedremo come creare temi in modo rapido e comodo a partire da qualsiasi layout.
Layout PSD:
https://drupalbook.org/sites/default/files/blueasy-freebie.zip
Nelle lezioni precedenti abbiamo già visto come creare un tema basato su un altro tema stabile. In questo tutorial vedremo come creare un tema basato su Bootstrap, un popolare framework per creare rapidamente layout di pagine.
Suppongo che tu abbia già installato Drupal. Passiamo quindi all’installazione di Bootstrap:
Prima di iniziare lo sviluppo su Drupal 8, è necessario disattivare la cache. A differenza di Drupal 7, nella versione 8 non vengono memorizzate nella cache solo entità, viste e campi, ma anche i template Twig compilati e i render template. Per disattivare tutta questa cache, segui questi passaggi:
1. Copia il file /sites/example.settings.local.php in /sites/default/settings.local.php
Questo file contiene già le impostazioni necessarie per disattivare la cache.