Eine Liste, die dein Kunde selbst erweitert
fld-loop="Listenname" Getränke, Bewertungen, ein Team, Fragen und Antworten: alles, wo gleiche Karten aufeinander folgen. Dein Kunde fügt Einträge hinzu, entfernt sie und ändert ihre Reihenfolge; das Design jeder Karte bleibt.
Wo es hingehört
An den Block mit den sich wiederholenden Karten. Die erste Karte mit Feldern wird zur Vorlage für einen Eintrag; die übrigen sind die Einträge, die „Daten laden“ überträgt.
Felder in einer Karte markierst du wie gewohnt: fld-text für Text, fld-image für ein Bild.
Das Feld erscheint im Adminbereich nur, wenn die Seite einen Gruppennamen hat: wp-fields-group auf ihrem <body>.
Beispiel: die Getränkekarte
<div class="cards" fld-loop="Drinks">
<article class="card">
<h3 fld-text="Name">Latte</h3>
<span fld-text="Price">$4.20</span>
</article>
<article class="card">
<h3 fld-text="Name">Cappuccino</h3>
<span fld-text="Price">$3.90</span>
</article>
</div>Den dritten Eintrag hat der Kunde im Adminbereich hinzugefügt; im Markup gab es ihn nicht.
Worauf es ankommt
- Zeichne jede Karte aus, nicht nur die erste. Eine Karte ohne Attribute kommt nicht in den Adminbereich.
- Der Listenname ist ihre Überschrift im Adminbereich: Schreib ihn so, dass dein Kunde ihn versteht.
- Verschiedene Namen für die Felder innerhalb eines Eintrags.
- Gibt es im Adminbereich keine Einträge, verschwindet der ganze Block von der Seite.
Typische Fehler
Das Build-Protokoll ist der Tab „Logs“ deines Projekts auf themeforge.pro; die kostenlose Markup-Prüfung zeigt dieselben Hinweise.
<div fld-loop="Drinks">
<div class="deco"></div>
<article class="card">
<h3 fld-text="Name">Latte</h3>
</article>
</div>Ein dekoratives Element vor den Karten: Der Build überspringt es, schreibt es ins Protokoll, und das Element wird nicht angezeigt.
<div class="deco"></div>
<div fld-loop="Drinks">
<article class="card">
<h3 fld-text="Name">Latte</h3>
</article>
</div>Dekoration gehört außerhalb der Liste.
<section fld-loop="Drinks">
<div fld-loop="Drinks">…</div>
</section>Eine Liste in einer Liste mit demselben Namen: Der Build benennt die innere in „Drinks 2“ um und meldet eine Kollision.
<section fld-loop="Menu sections">
<div fld-loop="Drinks">…</div>
</section>Jede Liste hat ihren eigenen Namen.
Dasselbe in den Website-Einstellungen oder bei einer Kategorie
fld-loop | auf einer Seite oder in einem Beitrag, wie oben |
|---|---|
opt-loop | in den Website-Einstellungen: eine Liste für alle Seiten, etwa Social-Media-Links |
tax-loop | bei einer Kategorie oder einem Schlagwort |
Alternative Schreibweise
f_loop, o_loop, t_loop funktioniert genauso: Der Build ergibt ein identisches Theme.