6.4. Twig è un nuovo motore di template per Drupal.

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.

<main role="main">
    <a id="main-content" tabindex="-1"></a>{# il link si trova in html.html.twig #}
 
    <div class="layout-content">
      {{ page.content }}
    </div>{# /.layout-content #}
 
    {% if page.sidebar_first %}
      <aside class="layout-sidebar-first" role="complementary">
        {{ page.sidebar_first }}
      </aside>
    {% endif %}
 
    {% if page.sidebar_second %}
      <aside class="layout-sidebar-second" role="complementary">
        {{ page.sidebar_second }}
      </aside>
    {% endif %}
 
  </main>

Nel template Twig non è possibile usare PHP, quindi è necessario utilizzare solo gli strumenti forniti da Twig — che sono più che sufficienti per gestire lo stile del sito.

Vediamo come lavorare con Twig.

Variabili in Twig

Se in PHP utilizziamo il simbolo del dollaro $ per le variabili, in Twig usiamo le parentesi graffe:

{{ variable }}

Quindi, scriviamo le variabili con due parentesi graffe aperte, uno spazio, il nome della variabile, uno spazio e due parentesi chiuse. Per visualizzare una variabile, non è necessario aggiungere la funzione print; in Twig non si usa PHP: per stampare una variabile, basta racchiuderla tra doppie parentesi graffe.

È anche molto comodo lavorare con oggetti e array: se prima bisognava sapere che $node è un oggetto e $form è un array, ora è più semplice — ci riferiamo alle proprietà delle variabili tramite un punto:

{{ node.id }}

Possiamo creare facilmente nuove variabili:

{% set foo = "bar" %}
 
Ciao, questa è la mia variabile: {{ foo }}

Nota la sintassi: quando definiamo una variabile, utilizziamo parentesi con il simbolo percentuale {% %}; quando la mostriamo, utilizziamo le doppie parentesi {{ }}.

Possiamo specificare non solo stringhe, ma anche array:

{%
  set foo_array = [
    'foo',
    'bar',
  ]
%}

Filtri Twig

Sebbene Twig non sia un linguaggio di programmazione completo, dispone di un set di strumenti per lavorare con i dati. Uno degli strumenti più importanti sono i filtri. I filtri si applicano con il simbolo della barra verticale |:

{{ variable|filter }}

I filtri permettono di modificare l’output delle variabili, ad esempio:

{{ node.title | length }} – stampa la lunghezza della stringa

{{ node.title | upper }} – visualizza la stringa in maiuscolo

{{ node.title | lower }} – visualizza la stringa in minuscolo

Per l’elenco completo dei filtri Twig, consulta la documentazione ufficiale: http://twig.sensiolabs.org/doc/filters/index.html

Filtri Twig di Drupal

Drupal aggiunge anche propri filtri a Twig, ad esempio per la gestione delle interruzioni di riga. Se in precedenza utilizzavamo la funzione t() in PHP per la traduzione, ora che non possiamo usare codice PHP in Twig, ci serve uno strumento alternativo che la sostituisca.

Alcuni esempi di filtri Drupal Twig sono:

• t
• passthrough
• placeholder
• drupal_escape
• safe_json
• without
• clean_class
• clean_id

Traduzione di stringhe in Twig

Twig supporta la traduzione delle stringhe in diverse lingue. Per tradurre una stringa, bisogna utilizzare il tag {% trans %}. Nota come sono scritte le strutture di controllo: usano il simbolo di percentuale % per differenziarsi dalle variabili.

{% trans %} Ciao mondo {% endtrans %}

È anche possibile passare variabili all’interno delle stringhe da tradurre:

{% trans %} Ciao {{ name }} {% endtrans %}

Possiamo inoltre modificare le variabili con i filtri prima della traduzione:

{% set name = name|capitalize %}
 
{% trans %}
  Ciao {{ name }}!
{% endtrans %}

Commenti in Twig

{# Commento qui #}

Istruzione If

Anche se Twig non include tutte le funzionalità di PHP, fornisce un insieme di costrutti per lavorare con array e variabili. Ad esempio, possiamo verificare se una variabile esiste prima di mostrarla:

{% if site_slogan %}
  <div class="site-slogan">{{ site_slogan }}</div>
{% endif %}

Ciclo Twig

Spesso nei template è necessario scorrere un array e visualizzarne gli elementi uno per uno. In Twig utilizziamo il ciclo for (simile a foreach in PHP):

{% for item in items %}
  {{ item.content }}
{% endfor %}

Possiamo anche usare il ciclo for in modo simile a un normale ciclo PHP, ma con una sintassi diversa:

{% for i in range(0, 3) %}
  {{ i }},
{% endfor %}

Possiamo anche utilizzare la struttura for else:

<ul>
{% for user in users %}
  <li>{{ user.username|e }}</li>
{% else %}
  <li><em>nessun utente trovato</em></li>
{% endfor %}
</ul>