Das Buchungs-Widget und sein Aussehen

Die „Jetzt buchen“-Schaltfläche einschalten

Verwenden Sie Theme-Editor öffnen im Einrichtungsleitfaden. Damit öffnen sich die App-Einbettungen Ihres Theme-Editors, und die Einbettung Jetzt buchen von Rezervito ist bereits eingeschaltet: Klicken Sie auf Speichern, und Sie sind fertig. Sie können im Theme-Editor auch selbst Theme-Einstellungen → App-Einbettungen öffnen und Jetzt buchen einschalten.

Das ist das Einzige, was eingeschaltet sein muss. Mit eingeschalteter Einbettung erscheint auf jeder Seite Ihres Shops eine schwebende Jetzt buchen-Schaltfläche in einer Ecke, und alle anderen „Jetzt buchen“-Schaltflächen funktionieren. Auf der Seite, auf der Kunden ihre Buchung sehen, erscheint sie nicht: Dort haben sie schon gebucht, und auf dem Handy würde sie die Schaltflächen der Seite verdecken. Solange die Warenkorb-Schublade, das Menü oder die Suche Ihres Themes geöffnet ist, tritt sie zur Seite, damit sie deren Schaltflächen nie verdeckt. Ist sie ausgeschaltet, funktioniert keine davon.

Der Schritt „Jetzt buchen“-Schaltfläche einschalten im Einrichtungsleitfaden hakt sich selbst ab, sobald die Einbettung in Ihrem Live-Theme eingeschaltet ist. Siehe Erste Schritte.

Die Einstellungen der Einbettung im Theme-Editor:

• Schwebende Schaltfläche anzeigen: zu Beginn eingeschaltet. Schalten Sie sie aus, wenn Sie lieber eigene Schaltflächen platzieren.
• Position: Unten rechts, Unten links, Mitte rechts oder Mitte links.
• Abstand zum Rand und Abstand nach unten, in Pixeln: zu Beginn 20. Bei einer Position „Mitte“ schiebt der Abstand nach unten die Schaltfläche stattdessen unter die Mitte.
• Anderer Abstand nach unten auf Smartphones: Schalten Sie das ein, um Abstand nach unten auf Smartphones festzulegen, zum Beispiel um die Schaltfläche über die fixierte „In den Warenkorb“-Leiste Ihres Themes oder einen Chat-Button zu heben.
• Beschriftung der Schaltfläche: Lassen Sie das Feld leer, um „Jetzt buchen“ in der Sprache anzuzeigen, in der Ihr Kunde den Shop ansieht.
• Beschriftung des Notizfelds und Platzhalter des Notizfelds: der Wortlaut des Notizfelds. Ob Kunden nach Notizen gefragt werden, legen Sie in Rezervito unter Einstellungen → Buchungsregeln → Kundenangaben fest. Bleibt der Platzhalter leer, zeigt das Feld einen Hinweis, keine Gesundheits- oder anderen sensiblen Angaben einzutragen; mit Ihrem eigenen Platzhalter steht dieser Hinweis stattdessen unter dem Feld.

Weitere „Jetzt buchen“-Schaltflächen

Jede „Jetzt buchen“-Schaltfläche öffnet dasselbe Buchungsfenster:

• Der Block „Buchungsschaltfläche“. Fügen Sie im Theme-Editor den Block Buchungsschaltfläche zu einem beliebigen Abschnitt hinzu, der App-Blöcke aufnimmt, zum Beispiel dem Hero-Bereich Ihrer Startseite oder dem Header Ihres Shops. Seine Einstellungen sind Beschriftung (leer zeigt „Jetzt buchen“ in der Sprache Ihres Kunden) und Ausrichtung: Links, Mitte oder Rechts. Im Header legt Position im Header sie Vor den Symbolen, Vor dem Warenkorb (die Voreinstellung) oder Nach dem Warenkorb ab; wie weit sie sich verschieben lässt, hängt von Ihrem Theme ab. Auf dem Handy erscheint sie kleiner und einzeilig; in einem Theme mit breitem Logo in der Mitte des Headers ist trotzdem womöglich kein Platz dafür. Prüfen Sie Ihren Shop daher auf dem Handy und nutzen Sie dort sonst die schwebende Schaltfläche oder einen Menülink. Der Block wird nur angezeigt, solange die Einbettung eingeschaltet ist.
• Jeder Link auf `#book-now`. Fügen Sie einen Menüpunkt oder eine Schaltfläche in Ihrem Theme hinzu, deren Link #book-now (oder /#book-now) ist. Er öffnet das Buchungsfenster auf der Seite, auf der der Kunde gerade ist. Das funktioniert auch dort, wo Ihr Theme keine App-Blöcke aufnimmt.
• Ein Link, den Sie teilen. Die Adresse Ihres Shops gefolgt von /#book-now, zum Beispiel https://your-store.com/#book-now, öffnet den Shop mit bereits geöffnetem Buchungsfenster. Verwenden Sie ihn in E-Mails, Social-Media-Beiträgen oder einem QR-Code.

Wenn Sie die schwebende Schaltfläche ausschalten und keine andere „Jetzt buchen“-Schaltfläche platzieren, haben Kunden keine Möglichkeit zu buchen, und nichts warnt Sie davor. Prüfen Sie Ihren Shop, nachdem Sie diese Einstellungen geändert haben.

Das Buchungsfenster folgt der Sprache Ihres Shops. Ist Kalender für neue Buchungen geöffnet unter Einstellungen → Buchungsregeln ausgeschaltet, zeigt es an, dass der Betrieb derzeit keine Buchungen annimmt. Siehe Wie Kunden buchen.

Ihre Buchungsseite

Ihr Shop hat auch eine Buchungsseite: die Adresse Ihres Shops gefolgt von /apps/booking, zum Beispiel https://ihr-shop.de/apps/booking. Sobald sie geladen ist, öffnet sich das Buchungsfenster. Unter dem Fenster zeigt die Seite „Termin buchen“ und eine Schaltfläche Jetzt buchen, sodass Kunden das Fenster nach dem Schließen wieder öffnen können.

Die Buchungsseite funktioniert auch, wenn die Einbettung ausgeschaltet ist oder Ihr Theme keine Apps aufnehmen kann. Sie ist daher der sicherste Link zum Teilen: im Menü, in sozialen Medien, in E-Mails oder als QR-Code an der Theke. Kopieren Sie ihre Adresse mit Link kopieren auf der Karte Wo Kunden buchen können unter Einstellungen → Darstellung. Die Seite erscheint in Ihrem Theme, in der Sprache, in der Ihre Kunden den Shop besuchen. Ihre Schaltfläche Jetzt buchen übernimmt Ihre Farben Schaltfläche und Schaltflächentext; mit Theme sieht sie aus wie die Schaltflächen Ihres Themes.

Wo Kunden buchen können

Die Karte Wo Kunden buchen können unter Einstellungen → Darstellung listet jeden Weg auf, das Buchungsfenster zu öffnen, jeweils mit eigener Abkürzung:

• Schwebende Schaltfläche: Ein oder Aus, wie in Ihrem Live-Theme gelesen, und wo sie sitzt, zum Beispiel „Unten rechts, auf jeder Seite.“
• Schaltfläche im Header oder in einem Abschnitt: Hinzufügen ↗ öffnet den Theme-Editor und fügt den Block Buchungsschaltfläche in Ihren Header ein. Manche Themes können ihn nicht im Header aufnehmen; fügen Sie ihn dann in einen Abschnitt ein.
• Menülink: #book-now mit Link kopieren. Gehen Sie in Shopify zu Inhalte → Menüs und fügen Sie einen Menüpunkt mit diesem Link hinzu.
• Buchungsseite: die Adresse Ihrer Buchungsseite mit Link kopieren.

Die Karte gruppiert sie: Unter In Ihrem Theme stehen die ersten drei, die die Einbettung Jetzt buchen brauchen, und ihre Kopfzeile zeigt Einbettung an oder Einbettung aus. Bearbeiten ↗ öffnet die App-Einbettungen des Theme-Editors. Unter Überall steht Ihre Buchungsseite, die auch ohne die Einbettung funktioniert.

Wurde Ihr Live-Theme offenbar von Canvas von Grund auf erstellt oder ist es gar nicht zu sehen, zeigt In Ihrem Theme Nicht verfügbar und seine Zeilen haben keine Abkürzungen, da ein solches Theme noch keine Apps aufnehmen kann: Nutzen Sie Ihre Buchungsseite.

Die Farben des Widgets wählen

Öffnen Sie Einstellungen → Darstellung. Die Karte Buchungs-Widget enthält:

• Farbschema: fertige Farbsätze. Theme, die Anfangsauswahl, legt keine eigenen Farben fest: Die „Jetzt buchen“-Schaltflächen sehen aus wie die Schaltflächen Ihres Themes, und das Buchungsfenster ist weiß mit dunklem Text. Jedes andere Schema legt alle fünf Farben fest, die Sie dann einzeln ändern können. Eigenes erscheint, sobald Sie eine Farbe von Hand ändern, und bleibt erhalten, damit Sie dorthin zurückkehren können, wenn Sie ein anderes Schema ausprobieren.
• Die fünf Farben: Text, Hintergrund, Schaltfläche, Schaltflächentext und Umriss-Schaltfläche.

Ein schwer lesbares Farbpaar wird mit Schwer lesbar markiert. Das ist nur ein Hinweis: Sie können es trotzdem speichern.

Die Vorschau zeigt die schwebende Jetzt buchen-Schaltfläche und das Buchungsfenster mit Beispieldaten in der Breite Smartphone oder Desktop: die Liste der Leistungen und die Uhrzeiten. Auf einem Computer steht sie neben den Karten, auf einem Smartphone darunter.

Speichern übernimmt die Farben sofort in Ihren Shop. Kann Ihr Shop nicht aktualisiert werden, wird nichts gespeichert, und Sie können es erneut versuchen.

Die „Jetzt buchen“-Schaltflächen übernehmen die Farben Schaltfläche und Schaltflächentext. Die Form der Schaltflächen Ihres Themes bleibt: Ecken, Größe und Schrift. Ist Theme gewählt, sehen sie aus wie die Schaltflächen Ihres Themes. Lassen sich die Schaltflächen Ihres Themes nicht erkennen, erhalten sie eine schlichte umrandete Schaltfläche.

Das Buchungsfenster verwendet immer die Schriftart Ihres Themes und die Schriftstärken, die Ihr Theme Text und Überschriften gibt, und wirkt so genauso leicht oder kräftig wie der Rest Ihres Shops. Alles andere bestimmt das Fenster selbst: Es behält seine Groß- und Kleinschreibung, Zeichenabstände, Größen und sein Layout, was Ihr Theme auch mit Überschriften, Beschriftungen und Feldern macht, und sein fetter Text (der Monat, der aktuelle Schritt, die Summe) ist nie leichter als der Text Ihres Shops. Es liest sich außerdem von links nach rechts, wie alle seine Sprachen, auch wenn Ihr Shop von rechts nach links eingerichtet ist (für Hebräisch oder Arabisch). Für jede weitere Gestaltung nutzen Sie das eigene benutzerdefinierte CSS Ihres Themes; eine Regel für das Buchungsfenster muss mit .rezervito-modal[data-rezervito-modal][open] beginnen (oder !important verwenden), damit sie greift. Die Farben gelten für jede „Jetzt buchen“-Schaltfläche und das Buchungsfenster in jedem Theme sowie für die Seite, auf der Kunden ihre Buchung ansehen, verschieben oder stornieren. Auch Ihre Buchungs-E-Mails übernehmen sie: Die Farbe Schaltfläche ist ihr Akzent (ein dunkles Grau bei Theme oder bei einer auf Weiß zu hellen Schaltfläche), dazu das Logo Ihres Shops, und die Seiten von Rezervito in Ihrem Shopify-Admin sehen immer aus wie Shopify.

Die Buchungsseite Ihrer Kunden ist wie ihre E-Mails aufgebaut: oben der Name Ihres Shops und die Buchungsnr., etwa #1042 (dieselbe Nummer wie im Admin); darunter der Status der Buchung, die Uhrzeit und die Leistung mit Mitarbeiter, Dauer und Preis. Unter Ändern oder stornieren steht, bis wann der Kunde die Zeit online ändern oder stornieren kann — in einem Satz, wenn beides zur selben Zeit endet —, mit den Schaltflächen Verschieben und Buchung stornieren. Verschieben öffnet dasselbe Buchungsfenster, in dem Kunden buchen, bei Zeit wählen für die Leistung dieser Buchung: Der Mitarbeiter ist schon gewählt, andere werden nur angeboten, wenn sie die Buchung zum gleichen Preis und mit gleicher Dauer übernehmen. Nach der Wahl einer Zeit zeigt das Fenster die neue Zeit, und Meine Buchung verschieben verschiebt sie und lädt die Seite neu. Buchung stornieren fragt zuerst nach, in einem Fenster mit Buchung behalten. Verschieben erscheint nur, solange das App-Embed „Book now“ in Ihrem Theme aktiviert ist. Geht online keines von beiden mehr, sagt die Seite das in einem Satz und zeigt die Schaltfläche E-Mail an den Salon. Die Seite eines Besuchs zeigt die Nummer einmal und jede Leistung nacheinander.

Das Rezervito-Zeichen

E-Mails an Ihre Kunden enden mit einer kurzen Zeile „Gebucht mit Rezervito“ und einem kleinen Symbol. Ihr Shop zeigt kein Rezervito-Zeichen: weder im Buchungsfenster noch auf der Buchungsseite Ihrer Kunden. In jedem Tarif gleich.

Um beides zu entfernen, kontaktieren Sie uns, und wir schalten es für Ihren Shop ab.

Das Aussehen des Mitarbeiterportals

Die Karte Mitarbeiterportal auf demselben Tab legt die Akzentfarbe des Portals fest: seine Hervorhebungen und Schaltflächen.

• Wie die Widget-Schaltfläche (die Anfangsauswahl) folgt der Farbe Schaltfläche des Widgets.
• Mit Eigene Farbe wählen Sie selbst eine aus.

Eine Akzentfarbe, die im Portal zu blass zum Lesen wäre, wird nicht verwendet: Das Portal behält das eigene Blau von Rezervito, und die Karte weist Sie darauf hin. Hintergrund, Text und Buchungsfarben des Portals bleiben immer gleich, damit es als Arbeitswerkzeug gut lesbar bleibt.

Das Portal zeigt das Logo Ihres Shops aus Einstellungen → Marke in Shopify; Markeneinstellungen öffnen bringt Sie dorthin. Ohne Logo zeigt es den Namen Ihres Shops. Siehe Team und Arbeitszeiten.

Die „Jetzt buchen“-Schaltfläche in einem mit Canvas erstellten Theme

Canvas ist Shopifys neue Art, ein Theme mit Sidekick zu erstellen. Ein mit Canvas dupliziertes Theme (im Menü ⋯ des Themes: Duplicate in Canvas) behält seine Apps, wie sie waren: War die Einbettung Jetzt buchen im Original eingeschaltet, funktionieren in der Kopie die schwebende Schaltfläche, das Buchungsfenster, Menülinks zu #book-now und Ihre Buchungsseite, und Rezervito sieht das Theme wie jedes andere. Ein Theme, das Canvas von Grund auf erstellt, kann noch keine Apps aufnehmen, und in Canvas selbst gibt es nichts einzuschalten. Rezervito erkennt ein solches Theme: Solange es live ist und die Einbettung aus ist, sagt der Schritt „Jetzt buchen“-Schaltfläche einschalten im Einrichtungsleitfaden, dass Ihr Live-Theme offenbar mit Canvas erstellt wurde, und zeigt statt Theme-Editor öffnen die Adresse Ihrer Buchungsseite mit Link kopieren. (Kann Rezervito Ihr Live-Theme gar nicht sehen, zeigt der Schritt „Wir können Ihr Live-Theme nicht sehen“ und bietet dieselbe Adresse an.)

In diesem Fall haben Sie zwei Möglichkeiten:

• Verlinken Sie Kunden auf Ihre Buchungsseite: Fügen Sie sie Ihrem Menü hinzu und nutzen Sie sie in sozialen Medien, E-Mails und QR-Codes.
• Veröffentlichen Sie ein reguläres Theme und schalten Sie dort die Einbettung Jetzt buchen ein.

Der Schritt bleibt offen, solange Ihr Live-Theme nicht sichtbar ist, und hakt sich selbst ab, sobald die Einbettung in einem Live-Theme eingeschaltet ist, das Rezervito sehen kann.

Beim Buchen erscheint „Etwas ist schiefgelaufen“

Rezervitos Adresse in Ihrem Shop ist fast überall /apps/booking, sie kann aber eine andere sein. Sie können sie in Shopify ändern (Einstellungen → Apps → Rezervito → App-Proxy), und Shopify gibt Rezervito eine andere Adresse, zum Beispiel /apps/booking-1, wenn eine andere App /apps/booking schon nutzt. Rezervito folgt der neuen Adresse von selbst, sobald ein Besuch es erreicht: Das Buchungsfenster probiert /apps/booking-1, /apps/booking-2 und /apps/booking-3 selbst aus, und die Karte Wo Kunden buchen können zeigt Ihre Buchungsseite dann unter der neuen Adresse. Danach gesendete Buchungs-E-Mails verlinken ebenfalls auf die neue Adresse.

Zeigt das Buchungsfenster weiterhin nur „Etwas ist schiefgelaufen. Bitte versuchen Sie es erneut.“, öffnen Sie Ihren Shop im Theme-Editor: Dort sagt das Buchungsfenster Ihnen, und nur Ihnen, was nicht stimmt. Gehen Sie in Shopify zu Einstellungen → Apps → Rezervito, öffnen Sie die dort angezeigte App-Proxy-URL einmal und laden Sie Ihren Shop dann neu.