Nozioni di base su Liquid
Come qualsiasi linguaggio di programmazione tradizionale, Liquid ha una sintassi definita, può usare definizioni di variabili e include costrutti come output e logica. I costrutti Liquid sono caratterizzati da due serie di delimitatori: i delimitatori con doppie parentesi graffe, {{ }}, che denotano l'output degli oggetti e delle variabili, e i delimitatori con simboli di percentuale tra parentesi graffe, {% %}, che denotano la logica e il flusso di controllo.
Suggerimento
Il contenuto della pagina e i frammenti di contenuto aiutano a "fare pratica" con Liquid, inserendo il contenuto di Liquid nello studio di progettazione di Power Pages. Procedendo in questo percorso di apprendimento, provare i frammenti di Liquid di esempio copiando e incollando il codice direttamente in una pagina tramite lo studio di progettazione di Power Pages o l'editor di Visual Studio Code.
Output
Un'istruzione di output è un set di parentesi graffe doppie che contiene un'espressione. Quando viene eseguito il rendering dell'output, viene sostituito con il valore di tale espressione. L'espressione può includere oggetti Liquid, le loro proprietà e le variabili. L'esempio seguente mostra una semplice istruzione di output:
Hello {{ user.firstname }} from {{ 'Power Pages' }}
Presupponendo che il nome dell'utente sia Doug, questa istruzione di output produce il risultato seguente:
Hello Doug from Power Pages
Filtri
Il markup di output può accettare filtri che modificano il risultato dell'istruzione di output. I filtri possono essere aggiunti seguendo l'espressione di output con un carattere barra verticale (|), il nome del filtro e i parametri facoltativi dopo i due punti (:).
Hello {{ user.firstname | upcase }} from {{ 'Power Pages' }}. The date is {{ 'now' | date: 'MMMM d yyyy' }}
Questa istruzione di filtro genera il seguente risultato:
Hello DOUG from Power Pages. The date is May 25, 2023.
Tag
È possibile usare tag per la logica e il flusso di controllo nel modello, ad esempio (nell'esempio è stato aggiunto anche codice HTML):
{% assign product = 'Power Pages' %}
<p>
{% if user %}
Hello, {{ user.firstname | upcase }}, from <strong>{{ product }}</strong>.
{% else %}
Greetings, <em>visitor</em>, from <strong>{{ product }}</strong>!
{% endif %}
</p>
<p>The time is {{ 'now' | date: 'g' }}</p>
In questo frammento, il tag assign crea una nuova variabile e il costrutto if... else genera un output che dipende dalla presenza della definizione dell'utente (in altre parole, dal fatto che un visitatore del sito Web abbia effettuato l'accesso o meno). L'output per un utente anonimo è il seguente:
Greetings, visitor, from Power Pages!
The time is 5/24/2023 11:33 AM
Liquid include diversi oggetti e tag predefiniti che lo rendono versatile e flessibile, ma i vantaggi più importanti derivano dalle estensioni Liquid implementate da Power Pages.