BineBoost

Ratgeber · Technik

Smoobu-Buchungssystem in WordPress einbinden: die Schritt-für-Schritt-Anleitung

Aktualisiert am 9. September 2026 · Lesezeit ca. 6 Minuten

Die kurze Antwort: Für die Einbindung in WordPress brauchst du kein Plugin, sondern nur einen iframe-Schnipsel in einem HTML-Block. In Gutenberg ist das der Block „Individuelles HTML“, in Elementor das Widget „HTML“, im Classic Editor der Reiter „Text“. Smoobu selbst nennt für WordPress genau diesen Custom-HTML-Block als Einbauort (Smoobus eigener Hilfeartikel, Stand September 2026). Danach bleiben vier Dinge zu prüfen: die Höhe des iframes, das Cookie-Banner, der Seiten-Cache und https.

Deine Ferienwohnungs-Website läuft auf WordPress, deine Kalender und Preise liegen in Smoobu. Jetzt sollen Gäste direkt auf deiner Seite buchen können. Die gute Nachricht: Dafür brauchst du kein Plugin und keinen Entwickler. Ein Buchungssystem wird als iframe eingebunden: ein kleiner HTML-Schnipsel, den WordPress von Haus aus versteht. Hier ist die komplette Anleitung inklusive der Stolperfallen, über die fast jeder einmal fällt.

Läuft deine Seite nicht auf WordPress, sondern auf dem Website-Baukasten von Smoobu, ist der Weg ein anderer: Den beschreibt der Ratgeber zum Einbinden in die Smoobu-Website Schritt für Schritt.

Das Prinzip: ein iframe, egal welches Theme

Ein iframe ist ein „Fenster“ in deiner Seite, in dem das Buchungssystem läuft. Der Schnipsel sieht (egal ob vom Smoobu-Standard-Widget oder von einer Lösung wie BineBoost) im Kern so aus:

<iframe src="https://…/dein-buchungssystem"
        style="width:100%; border:0;" height="900"
        title="Buchung"></iframe>

Wichtig ist nur, wo du diesen Schnipsel in WordPress einfügst: Das hängt von deinem Editor ab.

Gutenberg (Block-Editor)

  1. Seite bearbeiten → auf das + klicken → nach dem Block „Individuelles HTML“ suchen.
  2. Den iframe-Schnipsel einfügen.
  3. Oben auf „Vorschau“ wechseln: Der Kalender erscheint direkt im Editor. Speichern, fertig.

Elementor

  1. Seite mit Elementor bearbeiten → links das Widget „HTML“ in den gewünschten Bereich ziehen.
  2. Schnipsel in das Code-Feld einfügen: Die Vorschau aktualisiert sich sofort.

Classic Editor / andere Page-Builder

Im Classic Editor auf den Reiter „Text“ (nicht „Visuell“) wechseln und den Schnipsel einfügen. Divi, WPBakery & Co. haben alle ein „Code“- oder „Raw HTML“-Element: Das ist der richtige Ort.

Die 4 häufigsten Stolperfallen

1. Die Höhe: abgeschnittener Kalender oder doppelte Scrollbalken

Ein iframe hat eine feste Höhe. Ist sie zu klein, wird die Buchungsstrecke abgeschnitten oder bekommt einen eigenen Scrollbalken im Scrollbalken, was besonders am Handy stört. Zwei Lösungen: die Höhe großzügig fest einstellen (unschön, weil je nach Schritt Leerraum entsteht) oder ein Buchungssystem nutzen, das seine Höhe automatisch an die Seite meldet (per postMessage). BineBoost macht Letzteres von Haus aus; der Schnipsel aus dem Dashboard enthält die Auto-Höhe bereits.

2. Cookie-Banner blockiert das iframe

Consent-Plugins wie Borlabs, Complianz oder Cookiebot können iframes je nach Einstellung blockieren, bis der Besucher zustimmt. Dann sehen Gäste statt des Kalenders eine graue Fläche. Prüfe die Plugin-Einstellungen: Die Buchungsstrecke von BineBoost setzt für Gäste keine Cookies und lädt keine Tracking-Dienste; personenbezogene Daten kommen erst ins Spiel, wenn ein Gast seine Buchungsdaten eingibt. Viele Vermieter tragen die Domain des Buchungssystems deshalb als Ausnahme ein. Ob das für deine Seite passt, gehört in dein Datenschutzkonzept und im Zweifel vor deine Anwältin oder deinen Anwalt.

3. Caching-Plugins zeigen alte Versionen

Wenn du den Schnipsel änderst und nichts passiert: WP Rocket, LiteSpeed & Co. liefern oft eine gecachte Seite aus. Nach Änderungen den Seiten-Cache leeren.

4. HTTPS

Deine WordPress-Seite muss über https:// laufen (heute Standard). Ein http-iframe in einer https-Seite wird vom Browser blockiert. Achte darauf, dass der Schnipsel eine https-Adresse enthält.

Alternative ohne Einbindung: der direkte Buchungslink

Du kannst das Buchungssystem auch einfach verlinken: als Button „Jetzt buchen“, der auf die Buchungsseite führt. Das ist die richtige Wahl, wenn dein Theme wenig Platz lässt oder du die Buchung z. B. aus einem Instagram-Profil heraus erreichbar machen willst. Der Nachteil: Der Gast verlässt optisch deine Website, außer die Buchungsseite ist in deinem Design gehalten. Wie weit sich Farben, Schriften und Rundungen mitziehen lassen, steht im Ratgeber zum Anpassen des Buchungssystems an dein Website-Design.

Kurz-Checkliste vor dem Livegang: Kalender lädt auf Desktop und Handy? Keine doppelten Scrollbalken? Testbuchung bis zum letzten Schritt durchgespielt? Buchung in Smoobu angekommen? Cookie-Banner akzeptiert und abgelehnt getestet?

Steht der Kalender, geht es nur noch um die Frage, wie viele Gäste ihn auch benutzen. Was jede Buchung wert ist, die statt über ein Portal direkt bei dir landet, rechnet der Provisionsrechner aus.

Häufige Fragen

Brauche ich für Smoobu ein WordPress-Plugin?

Nein. Ein Buchungssystem wird als iframe eingebunden, und diesen HTML-Schnipsel nimmt WordPress im Block für individuelles HTML ohne jede Erweiterung an. Smoobu nennt in seinem eigenen Hilfeartikel für WordPress genau diesen Custom-HTML-Block als Einbauort, von einem Plugin ist dort nicht die Rede (Stand September 2026). Was du brauchst, ist der fertige Schnipsel und die richtige Stelle im Editor.

Wo genau füge ich den Schnipsel in WordPress ein?

Im Block-Editor Gutenberg über das Plus-Zeichen den Block für individuelles HTML einsetzen, nicht den Block für Shortcodes. Der Editor zeigt danach nur den Code, den Kalender siehst du erst, wenn du oben auf Vorschau wechselst. In Elementor heißt das passende Widget HTML, im Classic Editor wechselst du vorher auf den Reiter Text. Divi und WPBakery haben jeweils ein Code-Element, das denselben Zweck erfüllt.

Welches Buchungssystem passt zu einer Ferienwohnung auf WordPress?

Eines, das deinen bestehenden Kalender nutzt, statt einen zweiten aufzumachen. Ein reines WordPress-Buchungsplugin führt seine eigene Belegung, die von deinen Portalen nichts mitbekommt, solange du sie nicht zusätzlich abgleichst. Liegen deine Kalender schon in Smoobu, nimm ein Buchungssystem, das über die Smoobu-API darauf aufsetzt: Smoobu bleibt Kanalmanager, und jede Buchung landet im selben Kalender wie die Portalbuchungen.

Warum ist mein Kalender in WordPress unten abgeschnitten?

Weil der iframe eine feste Höhe hat, die Buchungsstrecke im Laufe der Schritte aber höher wird. Meist fällt es spät auf: Der Kalender passt noch, der Schritt mit den Gästedaten nicht mehr. Entweder stellst du die Höhe großzügig fest ein und nimmst Leerraum in Kauf, oder du nutzt ein Buchungssystem, das seine Höhe per postMessage an die Seite meldet. Am Handy übersieht man den abgeschnittenen Teil leicht ganz, prüfe deshalb auch dort den letzten Schritt.

Warum sehen Gäste statt des Kalenders eine graue Fläche?

Meist blockiert das Consent-Plugin den iframe, bis der Besucher zustimmt. Plugins wie Borlabs, Complianz oder Cookiebot können das je nach Einstellung für fremde Inhalte tun. Viele Vermieter tragen die Domain des Buchungssystems deshalb als Ausnahme ein; ob das für deine Seite passt, gehört in dein Datenschutzkonzept. Sieh dir die Seite danach einmal mit angenommenem und einmal mit abgelehntem Banner an.

Kommen die Buchungen von der WordPress-Seite in Smoobu an?

Ja, sofern das Buchungssystem über die offizielle Smoobu-API arbeitet. BineBoost legt die Buchung auf diesem Weg in deinem Smoobu-Konto an; an Smoobus Rolle als Kanalmanager ändert sich dadurch nichts. Prüfe das vor dem Livegang trotzdem einmal selbst: eine Testbuchung bis zum letzten Schritt durchspielen und danach in Smoobu nachsehen.

Die WordPress-freundliche Buchungsmaschine für Smoobu

BineBoost liefert dir den fertigen Schnipsel mit automatischer Höhe, Schritt-für-Schritt-Anleitungen für WordPress, Elementor, Wix & Co. und einem Design, das aussieht wie deine Website. Buchungen landen direkt in deinem Smoobu.

7 Tage kostenlos testen   Live-Demo ansehen

Keine Kreditkarte nötig: Die Testphase endet automatisch.