Reservierungs- und Gutschein-Widgets in Themes
Plattform-Abschnitte, Einrichtungsvoraussetzungen und der Unterschied zwischen Inline und schwebend.
Für EntwicklerFür echte Reservierungen und Gutscheine rendert TacticTable eigene Plattform-Widgets. Die Abschnittstypen booking-widget und voucher-widget werden von der Plattform bereitgestellt; ein gleichnamiges .liquid im Theme wird bei der Seitenrenderung nicht als Widget-Implementierung ausgeführt. Sie müssen die Widget-Funktionalität nicht mit einem Liquid-Formular nachbauen.
Ein Inline-Widget erscheint nur, wenn seine Einrichtung abgeschlossen ist, der Modus „Einbetten“ aktiv ist und section.settings.widget_placement_enabled auf true steht. Beim Reservierungswidget verlangt ready den Status COMPLETED und einen Abschlusszeitpunkt; beim Gutscheinwidget wird die Bereitschaft aus seinen Einrichtungseinstellungen berechnet. Die Plattform ergänzt das passende Schema mit Überschrift, Einleitung und Schalter automatisch. Eine nicht eingerichtete Widget-Art lässt sich im Theme Studio nicht hinzufügen. Auf einer Seite kann der Typ als normaler Eintrag in templates/*.json stehen; der Renderer erzeugt dann iframe und Script.
Im Modus „Schwebend“ hängt der Renderer den Knopf und Dialog selbst am Seitenende an, wenn das Widget eingerichtet und das globale Flag reservation_widget_enabled beziehungsweise voucher_widget_enabled aktiv ist. Ein zusätzlicher Abschnitt ist dann nicht nötig. Der ältere manuelle Loader-Code in einem Layout kann doppelte oder veraltete Einbettungen erzeugen; nutzen Sie die Plattform-Abschnitte beziehungsweise das globale Widget-Setting.
Für einen einfachen Reservierungslink können Sie restaurant.booking_url verwenden. Das LiquidJS-Tag {% form %} bietet hier keine TacticTable-Formularanbindung. Ein gewöhnliches HTML-Formular benötigt einen tatsächlich vorhandenen Endpunkt und eigene Zustimmungs-/Fehlerbehandlung; ein erfundenes action-Ziel verarbeitet nichts.
Codebeispiele
{ "sections": { "booking": { "type": "booking-widget", "settings": { "headline": "Tisch reservieren", "body": "Wir freuen uns auf Ihren Besuch.", "widget_placement_enabled": true } } }, "order": ["booking"]}<a href="{{ restaurant.booking_url | safe_href }}">Tisch reservieren</a>Siehe auch
- Ein vollständiges Restaurant-Theme zum KopierenAlle Dateien eines kleinen, lauffähigen TacticTable-Themes: Layout, zwei Vorlagen, editierbare Abschnitte und Blöcke, Navigation, CSS und Sprachen.
- Welche Liquid-Tags es gibt — und welche abbrechenSection und Schema als Plattform-Tags, dazu LiquidJS; fremde Form- und Style-Tags brechen ab.
- Abschnitte hinzufügen, sortieren und ausblendenDer Theme-Editor ist der einzige Ort, an dem Änderungen am Seitenaufbau tatsächlich auf der Website ankommen.