YAML Syntax in Theme Config auslesen

Die YAML Syntax anhand einer Liste erläutert, die beispielsweise Affiliate oder CTA Links aufnimmt und die vom Twig-Template ausgelesen werden können.

YAML Syntax in Pico CMS

Wenn Sie in Pico CMS ein Theme bearbeiten oder selbst erstellt haben, dann werden Sie bestimmt über die im Theme-Ordner vorhandene Datei:

pico-theme.yml

Code

gestolpert sein. Diese YAML-Datei nimmt lokale Theme Attribute auf, die speziell in diesem Theme erreichbar sein sollen und die übergeordnete config/config.yml überlagern sollen.

YAML bzw. YML ist eine strukturierte Datei für die Serialisierung (speichern) von Objekten und Daten, sie ist mit JSON oder XML verwandt, bietet jedoch eine noch leichtere Lesbarkeit für den Menschen. Gegenüber JSON, können in YAML auch Kommentare hinterlassen werden.

Eine YAML Liste anlegen

Legen Sie beispielsweise die folgende Liste in der Datei pico-theme.yml an, um einige Affiliate- oder CTA- Werbe-Links durch das Pico Theme auszulesen und anzuzeigen.

017  affiliate:
018      - cta:
019        active:       on
020        title:        WordPress 5
021        description:  Starten Sie mit WordPress 5 durch...
022        tag:          ['tag1','tag2','tag3','tag4']
023        link:         http...link 1
024      - cta:
025        active:       off
026        title:        GIMP-Handbuch
027        description:  Starten Sie mit GIMP durch...
028        tag:          ['tag1','tag2','tag3','tag4']
029        link:         http...link 2

Code

Sie legen auf oberster Ebene das Objekt affiliate an, welches eine Liste mit zwei cta Objekten enthält, welche die Attribute title, description und link enthalten.

Achten Sie penibel auf die korrekte Einrückungstiefe im YML, da der Parser überaus empfindlich auf falsche Einrückung reagiert - er quittiert es meist mit einem Abbruch.

YML Liste im Pico Twig-Theme auslesen

Wollen Sie diese Liste im Pico Theme und Template auslesen, dann können Sie dies mit dem folgenden Codeschnipsel realisieren:

056  {% for key in config.theme_config.affiliate %}
057      <p>          {{ key.title }}       </p>
058      <p>          {{ key.description }} </p>
059      <p>          {{ key.tag[0] }}      </p>
060      <a href="#"> {{ key.link }}        </a>
061  {% endfor %}

Code

Hinweis - Zeile 59 liest das erste Schlagwort aus der Tag-Liste des YAML aus. Für weitere, müssen Sie mit Twig iterieren.

boolean in YAML

Wenn Sie mögen, können Sie auch booleans in YAML verwenden. Die folgenden Values werden von YAML unterstützt:

active: on
active: off
active: yes
active: no

Code

Arrays in YAML

Auch Arrays sind problemlos mit der folgenden Syntax realisierbar:

key: ['keyword-1','keyword-2']

Code

Sie erhalten dann ein iterierbares Objekt, welches Sie mit einer Schleife iterieren müssen, um die Inhalte zu erhalten.

YAML Listen sind eine super Sache, denn Sie können dynamische Inhalte sehr schnell einbauen und das Pico Theme kann diese für den Leser zur Anzeige bringen. Solche YAML Listen können daher sehr gut für Affiliate oder CTA auf Ihrer Webseite genutzt werden. Zudem ist die YAML-Datei klein, lässt sich leicht pflegen und ist auch ruckzuck auf Ihre Webseite hochgeladen - ideal für kurze und spontane Interventionen.

Hinweis - Das oben gezeigte Coding bezieht sich auf die Template-Sprache Twig Symfony und muss für andere Parser entsprechend angepasst werden.

Sie können eigene YAML Listen natürlich auch in der Datei config/config.yml vornehmen, es hat die selbe Wirkung, da diese YAML-Datei ebenfalls von Pico eingelesen wird, allerdings für alle Themes dann gleichermaßen wirkt.

Merhzeiliger Inhalt in YAML

Sie können in YAML Inhalt in Form von Text mindestens in einer Zeile problemlos unterbringen, doch was ist wenn der Text mal länger und größer wird? Kein Problem, denn Sie können durchaus mehrzeiligen Content in YAML erzeugen. Laut der Definition der YAML Syntax, sind dafür zwei Token zuständig, zum einen ist es > (spitze Klammer) oder | (Pipe).

001  key1: >
002      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy...
003      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy...
004      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy...
005      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy...
006  key2: >
007      Lorem ipsum...

Code

Leiten Sie das Value mit > ein, dann können Sie mehrere Zeilen mit Inhalt füllen, die als zusammenhängendes value für key gelten.

Damit dies funktioniert, ist es wichtig, das die Einrückung des mehrzeiligen Textes auf die identische Spaltentiefe erfolgt. Ein etwaiger Umbruch (Linefeed, Return) am Ende des Textes wird natürlich ignoriert.

Das headless CMS Pico setzt als Datenspeicher konsequent auf YAML und bezieht von dort seine Konfiguration, Einstellungen und den eigentlichen Webseitencontent. Die YAML Syntax ist in Pico CMS vollumfänglich gültig, da Bibliotheken aus dem Twig-Symfony-Framework verwendet werden.

Weiterführende Informationen

• YAML Standard: YAML.org
• Symfony YAML: Symfony.com
• Einführung YAML: Geekflare.com

Weiterführende Links

• OnlineYamlTools.com: YAML Tools
• Yaml.org: YAML official
• Symfony.com: Symfony YAML

 28.01.2024    Kontakt@Oliver-Lohse.de    YAML Syntax