Noções básicas do Liquid
Semelhante a qualquer linguagem de programação tradicional, o Liquid tem uma sintaxe definida, pode usar definições de variáveis e inclui construções como saída e lógica. Os constructos do Liquid são reconhecíveis por dois conjuntos de delimitadores: os delimitadores de chaves duplas {{ }}, que denotam a saída dos objetos e variáveis, e os delimitadores de porcentagem de chaves {% %}, que denotam a lógica e o controle de fluxo.
Dica
O conteúdo da página e os trechos de conteúdo ajudam a facilitar a "prática" do Liquid inserindo o conteúdo do Liquid no estúdio de design do Power Pages. À medida que você avançar neste conteúdo de aprendizagem, experimente qualquer exemplo de fragmentos do Liquid copiando e colando o código diretamente em uma página usando o estúdio de design do Power Pages ou o Visual Studio Code.
Saída
Uma instrução de saída é um conjunto de chaves duplas que contém uma expressão. Quando a saída é renderizada, ela é substituída pelo valor dessa expressão. A expressão pode incluir objetos do Liquid, suas propriedades e variáveis. O exemplo a seguir mostra uma instrução de saída simples:
Hello {{ user.firstname }} from {{ 'Power Pages' }}
Supondo que o nome do usuário seja Doug, essa instrução de saída produzirá o seguinte resultado:
Hello Doug from Power Pages
Filtros
A marcação de saída pode usar filtros, que modificam o resultado da instrução de saída. Você pode adicionar filtros seguindo a expressão de saída com uma barra vertical (|), o nome do filtro e parâmetros opcionais após dois-pontos (:).
Hello {{ user.firstname | upcase }} from {{ 'Power Pages' }}. The date is {{ 'now' | date: 'MMMM d yyyy' }}
Essa instrução de filtro gera o seguinte resultado:
Hello DOUG from Power Pages. A data é 25 de maio de 2023.
Marcas
Você pode usar marcas para a lógica e o fluxo de controle em seu modelo, por exemplo (HTML também foi adicionado ao exemplo):
{% 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>
Nesse fragmento, a marca assign cria uma nova variável, e o constructo if... else gera uma saída que depende de o usuário ter sido definido ou não (em outras palavras, se um visitante do site entrou). A saída para um usuário anônimo é a seguinte:
Saudações, visitante, do Power Pages!
O horário é 24/05/2023 11:33
O Liquid inclui vários objetos e marcas integrados que o tornam versátil e flexível. Os benefícios reais vêm das extensões do Liquid que são implementadas pelo Power Pages.