Den Terminplaner auf Ihrer Website einbetten

Aktualisiert am 31. Oktober 2026Integrationen

Über Einstellungen → Integrationen können Besucher direkt auf Ihrer eigenen Website buchen, und zwar mit einem eingebetteten Terminplaner, statt hierher geschickt zu werden.

1. Ihre Domain freigeben

Tragen Sie unter Erlaubte Domains die exakte Adresse der Website ein, die den Terminplaner zeigen soll, also nur Protokoll und Domain (mit Port, falls es einen gibt), ohne Pfad und ohne abschließenden Schrägstrich:

https://apply.acme.com     ✓
https://acme.com:8443      ✓
acme.com                   ✗  Protokoll fehlt
https://acme.com/book      ✗  enthält einen Pfad
https://acme.com/          ✗  Schrägstrich am Ende

https://www.acme.com und https://acme.com sind verschiedene Adressen. Ist Ihre Website über beide erreichbar, tragen Sie beide ein.

Diese Liste ist zugleich der Ein-/Ausschalter: solange sie leer ist, lässt sich Ihr Terminplaner nirgends einbetten. Möglich sind bis zu 50 Domains; das Entfernen wirkt sofort.

Auf der Seite Integrationen eine erlaubte Domain hinzufügen

2. Code-Schnipsel einfügen

Jede freigegebene Anzeige hat ihren eigenen Schnipsel. Kopieren Sie ihn und fügen Sie ihn dort in Ihre Seite ein, wo der Terminplaner erscheinen soll:

<div class="scheduling-embed" data-service="SERVICE_ID"></div>
<script src="https://embed.example.com/embed.js" async></script>

Das <div> markiert die Stelle; das script-Tag kann überall auf der Seite stehen und muss nur einmal vorkommen, auch bei mehreren Terminplanern. Steht dort noch keine freigegebenen Anzeigen zum Einbetten, ist die Anzeige noch in Prüfung. Ihr Schnipsel erscheint nach der Freigabe.

Auf der Seite Integrationen das Snippet einer Anzeige kopieren

3. Sprache festlegen

Sprache des Terminkalenders auf dieser Seite bestimmt, was Besucher sehen. Belassen Sie es auf Sprache der Seite übernehmen, dann liest der Terminplaner das lang-Attribut im <html>-Tag Ihrer Seite, also dasselbe Attribut, das Suchmaschinen und Screenreader nutzen. Eine sauber lokalisierte Website braucht damit keine weitere Konfiguration:

Auf der Seite Integrationen die Sprache des Terminkalenders wählen

<!doctype html>
<html lang="es">      <!-- Terminplaner erscheint auf Spanisch -->
  <head>…</head>
  <body>…</body>
</html>

Regionale Kennungen funktionieren: lang="pt-BR" wird auf die nächstliegende unterstützte Sprache reduziert statt abgelehnt.

Um die Seitensprache für einen einzelnen Terminplaner zu übergehen, setzen Sie data-locale auf das Einbettungs-Div. Es schlägt sowohl die Seitensprache als auch die Einstellung auf dieser Seite:

<div class="scheduling-embed" data-service="SERVICE_ID" data-locale="de"></div>

Hat Ihre Seite eine eigene Sprachumschaltung, lassen Sie den Terminplaner ihr folgen. Der Wechsel erfolgt an Ort und Stelle, bereits Eingegebenes bleibt erhalten:

window.SchedulerEmbed.setLocale("sr");

Kurz gesagt gewinnt das Erste, das gesetzt ist: data-locale, dann das <html lang> Ihrer Seite, dann Sprache des Terminkalenders, dann der Browser des Besuchers, dann Englisch.

Weitere Optionen

Ergänzen Sie diese am Einbettungs-Div:

data-mode="popup" zeigt eine Schaltfläche, die den Terminplaner in einem Overlay öffnet, statt ihn direkt einzubetten.

data-label="Jetzt buchen" setzt den Text der Schaltfläche im Popup-Modus.

data-min-height="480" setzt die Höhe in Pixeln, bevor der Terminplaner seine tatsächliche Größe meldet. Erhöhen Sie sie, wenn es beim Laden springt.

Zwei weitere Aufrufe stehen bereit, wenn Ihre Website Inhalte dynamisch einfügt oder Conversions misst:

// Seite nach dem Einfügen eines Terminplaner-Divs erneut durchsuchen
window.SchedulerEmbed.refresh();

// Wird ausgelöst, wenn ein Besucher eine Buchung abschließt
window.SchedulerEmbed.onBooking(function (e) {
  console.log(e.bookingId, e.serviceId);
});

KI-Assistenten

Über WebMCP, einen vorgeschlagenen Webstandard, stellt der Terminplaner auch KI-Assistenten Werkzeuge bereit. Damit kann ein Assistent, der einem Besucher in dessen Browser hilft, Ihre Anzeige samt Preisen lesen, freie Zeiten finden und eine Uhrzeit so auswählen, dass der Besucher sie sieht. Buchen kann er ebenfalls, doch die Buchung ist als zustimmungspflichtig gekennzeichnet, deshalb fragt der Assistent den Besucher vorher. Anmelden, ein Konto anlegen und bezahlen bleiben immer dem Besucher überlassen.

Sie müssen nichts einrichten: Der Schnipsel erlaubt das bereits. Nur wenn Sie den Terminplaner statt mit dem Schnipsel mit einem eigenen <iframe>-Tag eingebunden haben, ergänzen Sie an diesem Tag allow="payment; tools".

Die Unterstützung durch Assistenten ist noch neu. Die Desktop-App von ChatGPT nutzt diese Werkzeuge in ihrem eingebauten Browser bereits, auf der Seite Ihrer Anzeige bei uns und über den Link aus Buchungslink teilen. In einem Terminplaner, der in eine andere Website eingebettet ist, nutzt sie Werkzeuge noch nicht; der Terminplaner ist für Assistenten bereit, die das können. Besucher können in jedem Fall auch selbst buchen.

Wenn der Terminplaner nicht lädt

Die Adresse der Seite steht nicht auf der Liste oder stimmt nicht exakt überein. Schon http statt https oder ein fehlendes www blockiert ihn.

Der Schnipsel ist an einer Stelle gelandet, an der das Skript nicht laufen darf, etwa in einem Klartext- oder eingeschränkten HTML-Block Ihres Website-Baukastens.

Der Wert von data-service wurde verändert. Fügen Sie den Schnipsel unverändert ein, statt die ID abzutippen.

Die Anzeige wurde zurückgezogen oder ist nicht mehr freigegeben.