Sugester V2

Zmienne Liquid w layoutach

Aktualizacja: Wyświetleń: 4

Layouty CMS używają szablonów Liquid do dynamicznego renderowania treści. Zmienne definiujesz w polach (fields) strony.

Podstawowa składnia

Wyświetlanie zmiennych

{{ title }}
{{ brand | default: 'MojaFirma' }}

Warunki

{% if product == 'winery' %}
  <span class="text-purple-500">MojaFirma</span>
{% else %}
  <span class="text-emerald-500">MojaFirma</span>
{% endif %}

Pętle

{% for p in paragraphs %}
  {{ p }}
{% endfor %}

Popularne zmienne

Zmienna Opis Przykład
name Nazwa strony Dashboard PL
title Tytuł strony MojaFirma Dashboard
tagline Podtytuł/slogan Monitoring mikroklimatu
lang Kod języka pl, en
brand Nazwa marki MojaFirma
icon URL ikony/logo https://...svg
product Typ produktu vineyard, winery, Dashboard
current_lang Aktualny język (display) PL, EN
contact_email Email kontaktowy kontakt@firma.pl

Zmienne wielojęzyczne

Dla przełącznika języków:

{{ page_path_pl }}  → /dashboard
{{ page_path_en }}  → /dashboard-en

Przykład dropdown języka:

<a href="{{ page_path_pl }}" class="{% if lang == 'pl' %}active{% endif %}">PL</a>
<a href="{{ page_path_en }}" class="{% if lang == 'en' %}active{% endif %}">EN</a>

Zmienne systemowe

Zmienna Opis
paragraphs Tablica paragrafów strony
path Ścieżka URL strony

Filtry Liquid

{{ title | upcase }}              → TYTUŁ
{{ title | downcase }}            → tytuł
{{ email | default: 'brak' }}     → wartość domyślna
{{ text | truncate: 100 }}        → obcięcie tekstu
{{ price | append: ' PLN' }}      → dodanie tekstu
{{ url | remove: 'https://' }}    → usunięcie tekstu

Przykład kompletnego layoutu

<!DOCTYPE html>
<html lang="{{ lang | default: 'pl' }}">
<head>
  <title>{{ title }}</title>
</head>
<body>
  <header>
    <img src="{{ icon }}" alt="{{ brand }}">
    <span>{{ brand }}</span>
  </header>
  
  <main>
    {% for p in paragraphs %}
      {{ p }}
    {% endfor %}
  </main>
  
  <footer>
    <p>{{ contact_label }}: {{ contact_email }}</p>
  </footer>
</body>
</html>

Debugowanie

Aby zobaczyć wszystkie dostępne zmienne, dodaj tymczasowo:

<pre>{{ page | json }}</pre>

Czy ten wpis był pomocny?

Customer Reviews

Brak komentarzy

Dodaj komentarz