fbpx

So einfach ist die Integration von cituro in WordPress

Die Online-Buchung von cituro ist ohne Expertenwissen und mit wenigen Klicks auf einer WordPress Webseite eingerichtet. Zunächst brauchen Sie jedoch eine WordPress Webseite und einen cituro Account. Falls Sie diese noch nicht haben, können Sie sich hier bei WordPress registrieren und hier kostenlos bei cituro anmelden.
Und schon kann es los gehen!

Welche Variante möchten Sie verwenden?

Es gibt verschiedene Möglichkeiten das Buchungswidget von cituro in Ihre Seite zu integrieren. Wählen Sie Ihre gewünschte Variante aus:

  1. cituro Buchungswidget als Link oder IFrame integrieren? Dann folgen Sie dieser Anleitung.
  2. cituro Buchungswidget als Overlay integrieren? Dann folgen Sie dieser Anleitung.

cituro Buchungswidget als Link oder IFrame integrieren

Die Online-Terminbuchung wird bei dieser Variante als externe Seite verlinkt und kann anschließend mit einem Klick auf den Link aufgerufen werden. Wie das geht, zeigen wir hier:

Schritt 1:
Navigieren Sie in Ihrem cituro Manager zu Buchungswidget.

Buchungswidget anklicken

Schritt 2:
Wählen Sie den Tab Buchungswidget einbinden.

Buchungswidget einbinden anklicken

Schritt 3:
Kopieren Sie die Adresse unter 2. Website Integration (Link oder IFrame).

Code kopieren

Schritt 4:
Fügen Sie in WordPress einen Button oder einen Link hinzu.

Schritt 5:
Verwenden Sie als Zieladresse die in Schritt 3 kopierte Adresse aus cituro. FERTIG!

Mit Klick auf diesen Button können Ihre Kunden ab sofort Termine online bei Ihnen buchen.

cituro Buchungswidget als Overlay integrieren

Für diese Variante empfehlen wir die Einbindung des cituro Buchungswidgets als Overlay. Dabei wird die Online-Buchung nicht auf einer externen Buchungsseite vorgenommen, sondern öffnet sich nahtlos auf Ihrer Webseite, als stylishes Fenster mit abgedunkeltem Hintergrund. Wir bieten mehrere Möglichkeiten an das Buchungswidget zu öffnen.

Die Integration als Floatingbutton und als Standardbutton möchten wir in dieser Anleitung vorstellen (weitere finden Sie im cituro Manager unter Buchungswidget>Buchungswidget einbinden). Die Darstellung und Position des Buttons können Sie jederzeit im cituro Manager unter Buchungswidget>Design&Vorschau an Ihre Wünsche anpassen.

cituro Floatingbutton auf Ihrer WordPress Webseite einbinden

Der Floatingbutton oder auch schwebender Button taucht automatisch, je nach Konfiguration, links oder rechts am Bildschirmrand auf. Er läuft von alleine beim Scrollen mit und ist für den Webseitenbesucher immer sichtbar und präsent. Diese Variante erhält vom Besucher die größte Aufmerksamkeit und lädt am meisten zum Handeln (Termin buchen) ein. Und so geht es:

Schritt 1:
Navigieren Sie in Ihrem cituro Manager zu Buchungswidget.

Buchungswidget anklicken

Schritt 2:
Wählen Sie den Tab Buchungswidget einbinden.

Buchungswidget einbinden anklicken

Schritt 3:
Kopieren Sie den Code unter 1. Website Integration (Overlay).

Code kopieren

Schritt 4:
Wechseln Sie zu Ihrer WordPress Webseite und navigieren Sie im Menü zum Design und klicken Sie auf Editor.

Zu den Jimdo Einstellungen navigieren

Schritt 5:
Öffnen Sie die header.php Datei.

Hinweis: Die header.php wird bei einem WordPress Update überschrieben, daher empfehlen wir eine der beiden Optionen:

  1. Die meisten gängigen WordPress Themes bieten Möglichkeiten den Header direkt zu bearbeiten. Schauen Sie hierzu in die Dokumentation Ihres WordPress Themes.
  2. Erstellen Sie ein Child-Theme und verwenden die dazugehörige header.php
Head bearbeiten anklicken

Schritt 6:
Im letzten Schritt integrieren wir das Buchungswidget in Ihre WordPress Seite. Dazu fügen Sie den kopierten Code aus Schritt 3 in die header.php Datei zwischen dem head-tag ein. Klicken Sie anschließend auf Datei aktualisieren. FERTIG!

Head bearbeiten

Der Floatingbutton taucht nun automatisch auf Ihrer Webseite auf und Ihre Kunden können online Termine bei Ihnen buchen. Hinweis: Sie haben die Wahl ob der Code für die gesamte Webseite, oder nur für ausgewählte Unterseiten gelten soll. Abhängig von Ihrer Auswahl wird auch der Floatingbutton dargestellt.

cituro Standardbutton auf Ihrer WordPress Webseite einbinden

Der Standardbutton ist ein Button, den Sie an einer beliebigen Stelle Ihrer Webseite platzieren können. Anders als der Floatingbutton bleibt dieser Button exakt an dieser Stelle. Diese Variante ist etwas dezenter aber dennoch auffällig. Und so funktioniert es:

Schritt 1:
Navigieren Sie in Ihrem cituro Manager zu Buchungswidget.

Buchungswidget anklicken

Schritt 2:
Wählen Sie den Tab Buchungswidget einbinden.

Buchungswidget einbinden anklicken

Schritt 3:
Kopieren Sie den Code unter 1. Website Integration (Overlay).

Code kopieren

Schritt 4:
Wechseln Sie zu Ihrer WordPress Webseite und navigieren Sie im Menü zum Design und klicken Sie auf Editor.

Zu den Jimdo Einstellungen navigieren

Schritt 5:
Öffnen Sie die header.php Datei.

Hinweis: Die header.php wird bei einem WordPress Update überschrieben, daher empfehlen wir eine der beiden Optionen:

  1. Die meisten gängigen WordPress Themes bieten Möglichkeiten den Header direkt zu bearbeiten. Schauen Sie hierzu in die Dokumentation Ihres WordPress Themes.
  2. Erstellen Sie ein Child-Theme und verwenden die dazugehörige header.php
Head bearbeiten anklicken

Schritt 6:
Im nächsten Schritt fügen Sie den kopierten Code aus Schritt 3 in die header.php Datei zwischen dem head-tag ein. Klicken Sie anschließend auf Datei aktualisieren.

Head bearbeiten

Schritt 7:
Wechseln Sie nun zurück zum cituro Manager und kopieren Sie den Code unter 1. a) Website Integration (Overlay) > Standardbutton.

Code kopieren

Schritt 8:
Jetzt wollen wir den Standardbutton auf Ihrer WordPress Seite an der gewünschten Position platzieren. Dazu fügen Sie auf Ihrer Seite ein HTML-Code Element an der gewünschten Stelle ein.

Schritt 9:
Fügen Sie den kopierten Code aus Schritt 7 ein. Speichern Sie und laden Sie Ihre Seite neu. FERTIG!

Der Standardbutton taucht nun automatisch an der gewünschten Position auf Ihrer Webseite auf und Ihre Kunden können online Termine bei Ihnen buchen.