Tischreservierung auf Squarespace

Die eigenen Möglichkeiten von Squarespace

Squarespace hat ein Terminbuchungsprodukt für Salons und Berater. Es bucht eine Person für einen Zeitslot, und so funktioniert ein Restaurant nicht: Sie haben zwanzig Tische in verschiedenen Größen, Verweildauern, die von der Gruppengröße abhängen, und eine Küche, die nicht alle um 19:30 Uhr setzen kann. Der andere Weg, den Squarespace-Nutzer gehen, ist das Widget einer Marktplatz-Plattform, das Gebühren pro Gast und ein Monatsabo mitbringt. Was das kostet, sehen Sie in unserem OpenTable-Vergleich.

Tablez ist um Tische, Verweildauer und Taktung herum gebaut und kostenlos bis zu 60 Buchungen im Monat, danach £9.99 im Monat, ohne Gebühren pro Gast.

Das Buchungsformular in eine Seite einfügen

1. Öffnen Sie die Seite im Editor und klicken Sie auf Bearbeiten.
2. Fügen Sie dort, wo das Formular erscheinen soll, einen Block hinzu und wählen Sie Code.
3. Lassen Sie den Typ auf HTML und fügen Sie Ihren Einbettungscode ein:

<script src="https://tablez.uk/embed.js" data-venue="your-venue"></script>

4. Klicken Sie auf Übernehmen, dann auf Speichern.

Das Formular erscheint im Block und wächst mit, während Gäste es durchgehen. Code-Blöcke gibt es in allen aktuellen Squarespace-Tarifen. Wenn Sie einen sehr alten Tarif haben, der sie nicht kennt, nutzen Sie den Einbettungsblock mit der iframe-Version von der Widget-Seite.

Ein Button „Tisch reservieren“ im Header

Die meisten Restaurants wünschen sich einen Button in der Navigation statt eines Formulars, das auf einer Seite vergraben ist. Am einfachsten fügen Sie in Website-Stile einen Header-Button oder einen Navigationslink hinzu, der auf Ihre Buchungsseite unter https://tablez.uk/book/your-venue verweist. Stellen Sie ihn so ein, dass er in einem neuen Tab öffnet. Er braucht keinen Code und funktioniert auch in mobilen Menüs.

Wenn der Button stattdessen das Formular als Overlay über Ihrer Seite öffnen soll, fügen Sie die Button-Version des Skripts in einen Code-Block im Footer oder auf der Seite ein:

<script src="https://tablez.uk/embed.js" data-venue="your-venue" data-mode="button" data-label="Book a table" data-colour="#0f5c4c"></script>

Ändern Sie die Farbe passend zu Ihrer Website. Damit ein vorhandener Squarespace-Button das Overlay öffnet, müsste er die Klasse tablez-open erhalten, was Squarespace bei eigenen Buttons nicht zulässt. Praktisch bleiben daher der erzeugte Button oder ein einfacher Link.

Passend gestalten

Legen Sie in Ihrem Tablez-Dashboard eine Akzentfarbe fest und laden Sie Ihr Logo hoch. Das Formular nutzt beides. Es hat einen transparenten Hintergrund und nimmt so die Farbe des Bereichs an, in dem es sitzt. Wenn Ihre Website einen dunklen Bereich nutzt, setzen Sie das Formular in einen hellen, denn es ist für helle Hintergründe gedacht.

Fluid Engine und mobile Ansicht

In Fluid Engine (Squarespace 7.1) lässt sich ein Code-Block frei in der Größe ändern. Geben Sie ihm auf dem Handy die volle Breite des Abschnitts und am Desktop etwa 600 px, damit das Formular nicht gequetscht wird. Prüfen Sie die mobile Ansicht im Editor: Das Formular ist auf das Handy ausgelegt und sollte ohne Feinarbeit richtig aussehen.

Worauf Sie achten sollten

• Fügen Sie den Code nicht in einen Textblock ein. Er würde als Text angezeigt. Es muss ein Code-Block sein.
• Die Code-Einfügung von Squarespace (in den Einstellungen) ist für Skripte auf der ganzen Website gedacht. Sie können das Button-Skript dort einfügen, um auf jeder Seite einen Button zu haben, für ein Formular auf einer einzelnen Seite nehmen Sie aber einen Code-Block.
• Wenn Sie das Cookie-Banner von Squarespace im strengen Modus nutzen, bleibt das Widget unberührt, denn es setzt keine Cookies auf Ihrer Domain.