So fügen Sie Online-Buchungen zu Ihrer bestehenden Website hinzu
Sie müssen Ihre Website nicht neu erstellen oder Ihr CMS ersetzen, um Online-Buchungen anzunehmen. Mit Schedito konfigurieren Sie Leistungen, Ressourcen und Verfügbarkeit getrennt und fügen anschließend das Buchungswidget auf der Seite ein, auf der Kunden buchen sollen.
Dieser Leitfaden erklärt den allgemeinen Ablauf. Die genauen Schritte im Editor unterscheiden sich zwischen WordPress, Wix, Webflow, Squarespace, Joomla und individuell entwickelten Websites, die Buchungsarchitektur bleibt jedoch gleich.
Was Sie vor dem Start benötigen
Zugriff auf Ihre Website
Sie benötigen Zugriff auf die Seite oder Vorlage, auf der HTML, eingebettete Inhalte oder benutzerdefinierter Code hinzugefügt werden können.
Ein konfigurierter Buchungskalender
Ihr Schedito-Kalender sollte bereits die Leistungen, Ressourcen und Verfügbarkeiten enthalten, die Kunden buchen können sollen.
Ein paar Minuten zum Testen
Führen Sie nach der Veröffentlichung des Widgets eine echte Testbuchung durch und prüfen Sie das vollständige Kundenerlebnis, bevor Sie die Seite bewerben.
1. Konfigurieren Sie, was Kunden buchen können
Beginnen Sie in Schedito und nicht im Editor Ihrer Website. Erstellen Sie den Buchungskalender und fügen Sie die Leistungen hinzu, aus denen Kunden wählen können sollen.
Konfigurieren Sie für jede Leistung die passende Dauer und ordnen Sie die Personen oder anderen Ressourcen zu, die für die Erbringung benötigt werden. Ressourcen können Mitarbeiter, Räume, Geräte oder Kapazitäten für eine gemeinsame Sitzung oder Veranstaltung darstellen.
Diese Trennung ist wichtig: Ihre Website zeigt das Buchungserlebnis, während Schedito für die Buchungskonfiguration zuständig bleibt.
Was der Kunde bucht
Wie viel Zeit die Buchung benötigt
Wer oder was dafür benötigt wird
09:00–17:00
Geschlossen oder abweichende Zeiten
Nur an einem ausgewählten Datum und zu einer ausgewählten Uhrzeit verfügbar
2. Legen Sie fest, wann Buchungen verfügbar sind
Konfigurieren Sie die reguläre wiederkehrende Verfügbarkeit der beteiligten Personen oder Ressourcen. Fügen Sie anschließend datumsspezifische Ausnahmen hinzu, wenn der normale Zeitplan nicht gelten soll.
So können Sie normale Arbeitszeiten, Feiertage, Schließzeiten, besondere Öffnungszeiten und Termine darstellen, die nur an einem bestimmten Datum stattfinden.
Schedito berechnet die buchbaren Zeiten aus diesen Regeln, anstatt Sie zu zwingen, jeden möglichen Slot im Voraus manuell anzulegen.
3. Fügen Sie das Schedito-Buchungswidget zu Ihrer Website hinzu
Wählen Sie die Seite, auf der eine Buchung am sinnvollsten ist – zum Beispiel „Jetzt buchen“, „Termine“, „Kontakt“ oder eine leistungsspezifische Seite.
Fügen Sie den Schedito-Widget-Container mit der Organisations-ID und der öffentlichen Kalender-ID Ihres Buchungskalenders hinzu. Ihre Website muss außerdem die für die Integration erforderlichen Schedito-Widget-Ressourcen laden.
In einem Website-Baukasten platzieren Sie dies normalerweise in einer HTML-, Embed- oder Custom-Code-Komponente. Auf einer individuell entwickelten Website kann es direkt zur passenden Vorlage hinzugefügt werden.
Beispiel für den Widget-Container
<div class="schedito-widget"
data-organization-id="YOUR_ORGANIZATION_ID"
data-calendar-public-id="YOUR_CALENDAR_PUBLIC_ID">
</div>Wählen Sie jetzt Ihre Website-Plattform
Das Schedito-Buchungsmodell bleibt gleich, aber die beste Art, die drei Widget-Elemente zu platzieren, hängt davon ab, wie Ihre Website aufgebaut ist.
WordPress
Nutzen Sie die WordPress-spezifische Anleitung, um die gemeinsamen Schedito-Ressourcen zu laden und den Buchungskalender auf Ihrer Website zu platzieren.
Wix
Folgen Sie der Wix-spezifischen iframe-Integration, bei der Schedito-CSS, Widget-DIV und JavaScript gemeinsam im HTML-Embed bleiben.
Webflow
Verwenden Sie Webflow Custom Code für die gemeinsamen Ressourcen und ein Code Embed an der Stelle, an der der Buchungskalender erscheinen soll.
Squarespace
Verwenden Sie Squarespace Code Injection für die gemeinsamen Ressourcen und einen Code Block für das kalenderspezifische Widget.
Joomla
Laden Sie die gemeinsamen Frontend-Ressourcen auf Website- oder Template-Ebene und platzieren Sie einzelne Kalender über Joomla-Custom-Module.
Individuelle Website
Integrieren Sie Schedito direkt in Ihre eigene HTML-, CSS- und JavaScript-Architektur.
4. Testen Sie, bevor Sie Kunden dorthin schicken
Eine Buchungsseite ist Teil Ihrer Customer Journey. Testen Sie sie wie ein Kunde – nicht nur wie die Person, die sie konfiguriert hat.
Kundenablauf testen
Öffnen Sie die veröffentlichte Seite wie ein normaler Besucher. Wählen Sie eine Leistung, ein Datum und eine Uhrzeit und führen Sie eine Testbuchung von Anfang bis Ende durch.
Verfügbarkeit prüfen
Prüfen Sie, ob die angezeigten Zeiten zu den Verfügbarkeitsregeln, Ausnahmen, bestehenden Buchungen und möglichen Einschränkungen verbundener Kalender passen.
Mobilansicht und Theme prüfen
Testen Sie das Widget auf einem kleineren Bildschirm und prüfen Sie, ob die helle oder dunkle Darstellung und die visuellen Einstellungen zur umgebenden Website passen.
Häufige Fragen beim Einbetten von Online-Buchungen
Prüfen Sie zunächst, ob Organisations- und Kalender-ID korrekt sind und ob die erforderlichen Schedito-Widget-Ressourcen von der Seite geladen werden. Prüfen Sie außerdem die Browser-Konsole auf blockierte Skripte, Content-Security-Einschränkungen oder andere Frontend-Fehler.
Wenn Sie einen Website-Baukasten verwenden, stellen Sie sicher, dass er die benötigten eingebetteten Inhalte zulässt und das Widget-Markup beim Veröffentlichen der Seite nicht entfernt oder umschreibt.
Ein funktionierendes Widget bedeutet nicht automatisch, dass buchbare Zeit vorhanden ist. Prüfen Sie, ob die Leistung über den Kalender verfügbar ist, ob die erforderlichen Ressourcen Verfügbarkeit haben und ob datumsspezifische Ausnahmen den gewünschten Zeitraum nicht schließen.
Bestehende Buchungen, Kapazitätsgrenzen und Termine aus verbundenen externen Kalendern können ebenfalls Zeiten entfernen, die sonst verfügbar wären.
Platzieren Sie das Widget in einem responsiven Seitencontainer, statt es in ein Element mit fester Breite zu zwingen. Prüfen Sie außerdem Padding- und Breitenregeln, die vom Theme Ihrer Website geerbt werden.
Das Schedito-Widget ist dafür ausgelegt, sich an unterschiedliche Bildschirmgrößen anzupassen, aber das umgebende Website-Layout bestimmt weiterhin, wie viel nutzbarer Platz zur Verfügung steht.
Ja. Schedito unterstützt konfigurierbare visuelle Eigenschaften, individuelle Farben sowie helle und dunkle Darstellungsmodi. Wählen Sie den Modus, der zur umgebenden Seite passt, und verfeinern Sie anschließend das Styling nach Bedarf.
Geeignete Tarife bieten außerdem zusätzliche Branding-Optionen. Beachten Sie, dass visuelle Konsistenz und Barrierefreiheit zusammenhängen, aber nicht dasselbe sind: Kontrast und Lesbarkeit sollten weiterhin auf der gesamten Seite geprüft werden.
Normalerweise müssen Sie das Widget in die neue Website einsetzen, Ihre Schedito-Buchungskonfiguration bleibt jedoch getrennt bestehen. Leistungen, Ressourcen, Verfügbarkeit und Buchungsdaten müssen nicht neu aufgebaut werden, nur weil sich CMS oder Frontend ändern.
Benötigen Sie Anweisungen für Ihre konkrete Website-Plattform?
Das Integrationsprinzip ist auf allen Websites gleich, die Schritte im Editor unterscheiden sich jedoch. Plattformspezifische Schedito-Leitfäden für WordPress, Wix, Webflow, Squarespace, Joomla und individuelle Websites erklären genau, wo und wie Sie das Widget hinzufügen.
Schedito-Ressourcen durchsuchen · So funktioniert Schedito · Buchungswidget entdecken