Drupal Twig template

Drupal Twig template: come esaminare il valore di un campo

See the article in English

Lavoriamo con Drupal 8 o 9 e per realizzare nuovi content-type o ,semplicemente, delle stupende pagine usiamo i template Twig che dalla versione 8 di Drupal sono lo standard (in Drupal 7 o precedente i template si scrivevano direttamente in PHP).

Se dobbiamo rendere un campo in base a com’è stato configurato nel sul content-type usiamo la semplice funzione in un template Drupal Twig:

{{ content.fieldname }}

ed il campo viene reso perfettamente da Drupal.

Spesso, però, non dobbiamo rendere il campo così com’è ma potremmo volere prelevare solamente il suo valore per testarlo o renderlo in HTML con dei tag diversi da come verrebbero resi di default da Drupal.

Quindi nei successivi paragrafi vengono analizzate le principali tipologie di campi di Drupal a partire dai campi semplici a quelli di tipo “Entity reference” per ricavare i dati che potrebbero servirci durante lo sviluppo di un sito.

Campi Drupal

Introduzione

Come ipotesi generale per ogni campo che analizzeremo consideriamo che la variabile “node” restituisca il nodo attuale e che “fieldname” sia il nome (il machine name) del campo da analizzare.

Inoltre consideriamo sempre il primo elemento di ogni campo anche se è definito come campo multiplo (consideriamo l’elemento “0” dell’array del campo).

Per capirci meglio se “fieldname” è un campo multiplo di 3 elementi allora:

{{ node.fieldname[0] }} {# è il primo elemento #}
{{ node.fieldname[1] }} {# è il secondo elemento #}
{{ node.fieldname[2] }} {# è il terzo elemento #}

mentre se consideriamo tutto l’array avremmo un oggetto di tipo FieldItemList o un suo derivato (una super classe come EntityReferenceFieldItemList o FileFieldItemList)

{{ node.fieldname }} {# FieldItemList! #}

Gruppo campi “General”

Per questo tipo di campi il Namespace è unico ed è Drupal\Core\Field\Plugin\Field\FieldType

Boolean

Class: BooleanItem

{# value: restituisce il valore "1" oppure "0" #}
{{ node.fieldname[0].value }}
{# getPossibleOptions(): restituisce un array di 2 elementi la cui chiavi sono:
 "0" ed "1" ed i valori sono "On" ed "Off" 
 o quelli definiti durante la creazione del campo 
 array { 
   0 => "On", 
   1 => "Off" 
 } 
#} 
{{ node.fieldname[0].getPossibleOptions() }}
{# getPossibleValues(): restituisce un array con i possibili valori 
  array { 
    0 => 0, 
    1 => 1 
  } 
 #} 
 {{ node.fieldname[0].getPossibleValue() }}

Date

Class: DateTimeItem

{{ node.fieldname[0].value }}

Timestamp

Class: TimestampItem

{{ node.fieldname[0].value }}

Email

Class: EmailItem

{{ node.fieldname[0].value }}

Link

Class: LinkItem

{# node.uri: restituisce l'uri dell'url #}
{{ node.fieldname[0].value.uri }}
{# value.title: restituisce il title del link #}
{{ node.fieldname[0].value.title }}
{# value: restituisce un array con chiavi url e title #}
{{ node.fieldname[0].value }}

Gruppo campi “Number”

Namespace: Drupal\options\Plugin\Field\FieldType

{{ node.fieldname[0].value }}

List (float) e List (integer)

Class: ListFloatItem e ListIntegerItem

{# value: restituisce il valore float o integer #}
{{ node.fieldname[0].value }}
{# 
 # getPossibleValues(): Restituisce un array di possibili valori
 # array { 0 => "0.1", 1 => "0.55",2 => "18" } 
 #}
{{ node.fieldname[0].getPossibleValues() }}
{#
 # getPossibleOptions(): Restituisce un array di possibili valori con le label per la visualizzazione
 #  array { 0.1 =>  "un decimo", 0.55 => "zero and 55", 18 =>   "eighteen" }
#}
{{ node.fieldname[0].getPossibleOptions() }}

Number (decimal, float, int)

Class: DecimalItem, FloatItem, IntegerItem

{# value: resituisce il valore numerico decimale, float o int in base al tipo di campo #}
{{ node.fieldname[0].value }}

Gruppi campi “Text”

Namespace: Drupal\options\Plugin\Field\FieldType

List (text)

Class: ListStringItem

{# value: restituisce la chiave selezionata #}
{{ node.fieldname[0].value }}
{# 
 # getPossibleValues(): Restituisce un array di possibili valori
 # array { 0 => "0.1", 1 => "0.55",2 => "18" } 
 #}
{{ node.fieldname[0].getPossibleValues() }}
{#
 # getPossibleOptions(): Restituisce un array di possibili valori con le label per la visualizzazione
 #  array { 0.1 =>  "un decimo", 0.55 => "zero and 55", 18 =>   "eighteen" }
#}
{{ node.fieldname[0].getPossibleOptions() }}

Text (formatted, long, summary, plain)

Class: TextItem, TextLongItem, TextWithSummaryItem, StringItem, StringLongItem

{# value: restituisce il testo con i tag html, se disponibili #}
{{ node.fieldname[0].value }}
{# summary: restituisce il riassunto del campo se tale campo lo prevede #}
{{ node.fieldname[0].summary }}

Gruppo campi “Reference”

Namespace: Drupal\Core\Field\Plugin\Field\FieldType
Class: EntityReferenceItem o la estende (come in File ed Image)

Ogni campo del gruppo “Reference” sarà quindi un oggetto Drupal\Core\Field\Plugin\Field\FieldType\EntityReferenceItem o di una classe che lo estende:

{# è un oggetto EntityReferenceItem #}
{{ node.fieldname[0].entity }}

Per aver quindi l’entità associata al campo bisogna utilizzare:

{{ node.fieldname[0].entity }}

Se vogliamo l’id dell’entity:

{{ node.fieldname[0].entity.id }}

Content

Namespace entity: Drupal\node\Entity
Class entity: Node

Dato che l’oggetto associato all’entity è di tipo “Node” possiamo avere tutti i dati ad esso relativi:

{# nid.value: restituisce il node id #}
{{ node.fieldname[0].entity.nid.value }}
{# title.value: restituisce il titolo del nodo #}
{{ node.fieldname[0].entity.title.value }}
{# body.value: restituisce il body #}
{{ node.field_test_ref_content[0].entity.body.value }}
{# | view: rende il campo #}
{{ node.field_test_ref_content[0].entity.body | view }}
{# created.value: restituisce la data di creazione #}
{{ node.field_test_ref_content[0].entity.created.value }}
{# | view: rende l'intero nodo se applicato all'entity #}
{{ node.field_test_ref_content[0].entity | view }}

Custom Block

Namespace entity: Drupal\block_content\Entity
Class entity: BlockContent

Troviamo i dati principali del blocco con:

{# id.value: restituisce l'id del blocco #}
{{ node.fieldname[0].entity.id.value }}
{# info.value: restituisce la descrizione del blocco #}
{{ node.fieldname[0].entity.info.value }}
{# body.value: restutuisce l'html del body del blocco #}
{{ node.fieldname[0].entity.body.value }}
{# body.summary: restituisce il riassunto del blocco #}
{{ node.fieldname[0].entity.body.summary }}
{# | view: rende il blocco #}
{{ node.fieldname[0].entity | view }}

Taxonomy term

Namespace entity: Drupal\taxonomy\Entity
Class entity: Term

I dati del campo Taxonomy term li troviamo con:

{# id.value: restituisce l'id del term #}
{{ node.fieldname[0].entity.id.value }}
{# name.value: restituisce il nome del term #}
{{ node.fieldname[0].entity.name.value }}
{# description.value: restituisce la descrizione del term #}
{{ node.fieldname[0].entity.description.value }}
{# | view: rende il taxonomy term #}
{{ node.fieldname[0].entity | view }}

Media

Namespace entity: Drupal\media\Entity
Class entity: Media

Media è un campo complesso che a sua volta ha ancora altri campi di cui uno è quello principale che lo distingue tra i vari “Media types” (vedere /admin/structure/media per i tipi esistenti e come crearne altri).

I dati principali del campo Media si trovano con:

{# mid.value: restituisce il media id #}
{{ node.fieldname[0].entity.mid.value }}
{# bundle(): restituisce il bundle ovvero il nome del Media type #}
{{ node.fieldname[0].entity.bundle() }}
{# name.value: restituisce il nome del campo Media #}
{{ node.fieldname[0].entity.name.value }}
{# | view: rende il Media #}
{{ node.fieldname[2].entity | view }}

Supponendo che il Media type sia “Image” allora il campo principale che imposta Drupal avrà il machine namefield_media_image” mentre “Audio” avrà il campo “field_media_audio_file” e “Document” avrà “field_media_document“.
Per gli altri Media types vedere la relativa pagina su Drupal.

Nel caso di “Image” troviamo il campo “field_media_image” con

{{ node.fieldname[0].entity.field_media_image }}

Tale campo è un oggetto di tipo “ImageItem” e quindi riusciamo a trovare tutti i campi di nostro interesse come width, height, alt, il nome del file, l’uri, l’url, il mime type e la dimensione in byte come spiegato sotto nel paragrafo File ed Image.

File

Class: FileItem (estende EntityReferenceItem)

La classe FileItem aggiunge alcune caratteristiche in più rispetto ad EntityReferenceItem che possono esser riassunte in questo template Drupal Twig:

{# description: restituisce la descrizione #}
{{ node.fieldname[0].description }}
{# getUploadLocation(): restituisce l'uri della dir dove fare l'upload (public://2021-02) #}
{{ node.field_test_ref_file[0].getUploadLocation() }}
{# file_url: restituisce il path relativo dove poter fare l'upload (/sites/default/files/2021-02) #}
{{ file_url(node.field_test_ref_file[0].getUploadLocation()) }}

Namespace entity: Drupal\file\Entity
Class entity: File

{# getFilename(): restituisce il nome del file #}
{{ node.fieldname[0].entity.getFilename() }}
{# getFileUri(): restituisce l'uri interno (public://2021-01/test.txt o private://2021-01/test.txt) #}
{{ node.fieldname[0].entity.getFileUri() }}
{# getMimeType(): restituisce il mime type #}
{{ node.fieldname[0].entity.getMimeType() }}
{# getSize(): restituisce la dimensione in byte #}
{{ node.fieldname[0].entity.getSize() }}
{# file_url(): restituisce l'url relativo alla base url del sito #}
{{ file_url(node.fieldname[0].entity.getFileUri()) }}

Image

Class: ImageItem (estende FileItem, estende EntityReferenceItem)

La classe ImageItem aggiunge alcune caratteristiche in più rispetto a FileItem e ad EntityReferenceItem che possono esser riassunte con questo template Drupal twig:

{# alt: restituisce il testo alternativo #}
{{ node.fieldname[0].alt }}
{# title: restituisce il titolo dell'immagine #}
{{ node.fieldname[0].title }}
{# width: restituisce la larghezza in pixel dell'immagine #}
{{ node.fieldname[0].width }}
{# height: restituisce l'altezza in pixel dell'immagine #}
{{ node.fieldname[0].height }}

Namespace entity: Drupal\file\Entity
Class entity: File

Dato che la Classe ed il Namespace sono identici all’entity del tipo File valgono le stesse chiamate Twig: getFilename(), getFileUri(), getMimeType() e getSize().

Riferimenti

Namespaces

Classi

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

50 + = 51