Speisekarte, Navigation und Öffnungszeiten im Template

Die vier Inhaltsobjekte, die aus der Verwaltung kommen — jeweils als Liste und als Nachschlagewerk.

Für Entwickler

Voraussetzungen

  • Recht: website:write

Jedes dieser Objekte gibt es zweimal: als Liste zum Durchlaufen und als Zuordnung zum gezielten Nachschlagen. Die Zuordnung braucht man, wenn ein Abschnitt per Einstellung auswählen lässt, welches Menü er zeigen soll.

`products` ist Ihre Speisekarte. Je Eintrag: `id`, `title`, `subtitle`, `description`, `price` (bereits in deutscher Schreibweise als Text, etwa „14,90 €"), `price_cents` (die Zahl in Cent), `image_url`, `is_vegetarian`, `is_vegan` und `is_gluten_free`. Dazu `products_by_id`.

`navigation_menus` sind die Navigationsmenüs. Je Eintrag: `id`, `handle`, `title` und `items`; je Eintrag darin `label`, `url`, `open_in_new` und `target_id`. Nachschlagen über `navigation_menus_by_id` und `navigation_menus_by_handle` — letzteres ist der bequeme Weg, ein Menü mit fester Kurzkennung im Fussbereich einzubinden.

`opening_hours_sets` sind die Öffnungszeiten-Sets. Je Eintrag: `id`, `title` und `days` mit denselben Feldern wie `restaurant.opening_hours`. Dazu `opening_hours_sets_by_id`. Damit zeigen Sie bei Bedarf die Zeiten der Terrasse getrennt von denen des Innenbereichs.

`menus` sind die Speisekarten-Menüs aus der Warenwirtschaft. Je Eintrag: `id`, `name` und `categories` als Liste von Bezeichnungen. Dazu `menus_by_id`.

Wie eine Einstellung dem Redakteur diese Dinge zur Auswahl stellt, steht im Artikel über die Einstellungstypen — das Stichwort dort heisst `dynamic_options`.

Codebeispiele

Die Speisekarte ausgeben
Liquid
<ul class="speisekarte">{%- for gericht in products %}  <li>    <span>{{ gericht.title | escape }}</span>    {%- if gericht.description != blank %}<span>{{ gericht.description | escape }}</span>{% endif %}    <span>{{ gericht.price }}</span>    {%- if gericht.is_vegan %}<span class="zeichen">vegan</span>    {%- elsif gericht.is_vegetarian %}<span class="zeichen">vegetarisch</span>{% endif %}    {%- if gericht.is_gluten_free %}<span class="zeichen">glutenfrei</span>{% endif %}  </li>{%- else %}  <li>Die Karte wird gerade überarbeitet.</li>{%- endfor %}</ul>
Nehmen Sie `price` — der Text ist bereits in deutscher Schreibweise fertig. `price_cents` brauchen Sie nur zum Rechnen; dann durch `100.0` teilen und durch `money` schicken. Das `{% else %}` der Schleife fängt den neuen Betrieb ab, der noch keine Gerichte gepflegt hat.
Nur die veganen Gerichte
Liquid
Mit Filter: {{ products | where: 'is_vegan', true | map: 'title' | join: ', ' }}
Mit Schleife: {% for g in products %}{% if g.is_vegan %}{{ g.title }} {% endif %}{% endfor %}
Alles ausser vegan: {{ products | reject: 'is_vegan' | size }} Gerichte
Beide Wege gehen. Der Filter ist kürzer, die Schleife lesbarer, sobald mehr als eine Bedingung dazukommt. `reject` ist das Gegenstück zu `where` ohne Vergleichswert.
Ein Menü über eine Einstellung auswählen
Liquid
{%- assign gewaehlt = menus_by_id[section.settings.menu_id] | default: menus[0] -%}{% if gewaehlt %}  <h3>{{ gewaehlt.name | escape }}</h3>  <ul>{% for kategorie in gewaehlt.categories %}<li>{{ kategorie | escape }}</li>{% endfor %}</ul>{% endif %}
DAS ist der Grund, warum es jedes Inhaltsobjekt zweimal gibt: die Liste zum Durchlaufen und die Zuordnung zum Nachschlagen. Im Schema stellt ein `select` mit `dynamic_options` dem Redakteur die echten Menüs zur Auswahl; hier wird die gewählte Kennung nachgeschlagen. Ist nichts gewählt, ergibt das Nachschlagen nichts, und `default` fängt es auf.
Ein Navigationsmenü über seine Kurzkennung
Liquid
{%- assign menue = navigation_menus_by_handle['hauptmenue'] -%}<nav>{%- for eintrag in menue.items %}  <a href="{{ eintrag.url | safe_url }}"{% if eintrag.open_in_new %} target="_blank" rel="noopener"{% endif %}>{{ eintrag.label | escape }}</a>{%- endfor %}</nav>
Über `navigation_menus_by_handle` binden Sie ein Menü mit fester Kurzkennung ein, ohne dass jemand es im Editor auswählen muss. Ist die Kennung unbekannt, ist `menue` nichts — und die Schleife dreht null Runden, statt abzubrechen.
Ein zweites Öffnungszeiten-Set, etwa für die Terrasse
Liquid
{%- assign satz = opening_hours_sets_by_id[section.settings.zeiten_id] -%}{%- assign tage = satz.days | default: restaurant.opening_hours -%}<h4>{{ satz.title | default: 'Öffnungszeiten' }}</h4><ul>{% for tag in tage %}<li>{{ tag.label }}: {% if tag.closed %}geschlossen{% else %}{{ tag.times }}{% endif %}</li>{% endfor %}</ul>
Das Muster für jede Auswahl mit Rückfall: nachschlagen, dann mit `default` auf die Standardzeiten zurückfallen. Achten Sie darauf, dass `satz.days` auf einem nicht gefundenen Satz keinen Fehler wirft — eine Kette über nichts hinweg ergibt still nichts.

Wo im Dashboard

/restaurant/[slug]/website/themes/[id]/code

Im Dashboard öffnen

Siehe auch

← Zurück zu Theme-Entwicklung