Ratgeber · Einbindung

Eigene Buchungsmaschine in die Smoobu-Website einbinden

Stand: 25. August 2026 · Lesezeit ca. 5 Minuten

Bevor du anfängst

• Den Code bereitlegen. Bei BineBoost steht er im Dashboard unter „Einbindung“, ein Klick auf „Kopieren“ genügt. Es sind zwei Zeilen.
• Den API-Zugang haben. Ein Buchungs-Aufsatz verbindet sich über Smoobus Schnittstelle, und die ist im Tarif Professional enthalten.
• Wissen, dass die Book-now-Seite leer wird. Was du dort löschst, ist Smoobus Standard-Buchungsstrecke. Sie lässt sich jederzeit wieder einsetzen, und auf allen anderen Seiten bleibt sie ohnehin unberührt.

Schritt 1: die Buchungsmaschine einbauen

Sechs Klick-Schritte. Das Video zeigt den ganzen Weg am Stück, die Animationen darunter jeweils, wohin der Mauszeiger geht und was danach passiert.

1. Den Editor öffnen

In Smoobu links unter Kernfunktionen auf Webseiten-Baukasten, dann rechts oben auf Editor öffnen. Der Editor startet in einem neuen Tab.

2. Die Seite „Book now“ öffnen

Links in der schmalen Leiste auf Seiten. Die Seitenliste klappt auf, darin Book now anklicken. Das ist die Seite, auf der deine Buchungsmaschine stehen wird.

3. Die Seite leer räumen

Auf der Seite steht bereits Smoobus eigene Buchungsstrecke. Klick sie an, bis oben die kleine Leiste erscheint, und lösche sie über das Papierkorb-Symbol. Wiederhole das, bis die Seite leer ist und nur noch ein leerer Abschnitt übrig bleibt.

4. Das HTML-Feld einsetzen

Links auf Hinzufügen, dann Elemente. Ins Suchfeld html tippen und den Treffer HTML in den leeren Abschnitt ziehen.

5. Den Code einfügen

Es öffnet sich das Fenster HTML-Inhalt. Füge dort deinen kopierten Code ein und klick auf Aktualisieren. Die Buchungsmaschine erscheint sofort, schon im Editor.

6. Veröffentlichen

Rechts oben auf Erneut veröffentlichen. Smoobu bestätigt mit Ihr Projekt ist live und nennt die Adresse. Ruf sie auf und klick eine Buchung einmal bis zur Zusammenfassung durch.

Schritt 2: das Such-Widget für die Startseite

Das Such-Widget ist die kleine Suchleiste: Anreise, Abreise, Gäste, ein Knopf. Es bucht nichts, sondern schickt den Gast auf deine Buchungsseite, und zwar mit der Suche, die er gerade eingetippt hat. Der Einbau läuft wie oben, mit vier Unterschieden.

1. Buchungsseite eintragen, dann den Code kopieren

In BineBoost unter Einbindung bis zum Abschnitt Such-Widget scrollen. Dort trägst du die Adresse deiner Buchungsseite ein, also genau die Seite, auf der die Buchungsmaschine sitzt, und speicherst. Erst danach den Code kopieren.

2. Die vorhandene Suche entfernen

Öffne im Editor die Seite, auf der die Suche stehen soll, meist die Startseite. Dort liegt Smoobus eigene Suchleiste schon im Kopfbild, erkennbar am Vermerk Nur anzeigen. Wähle den Abschnitt aus und klick in seiner Leiste auf den Papierkorb. Smoobu fragt einmal nach, das ist die Sicherheitsabfrage.

3. Einen leeren Abschnitt anlegen

Unter dem Kopfbereich auf + Abschnitt hinzufügen und Layout wählen. Es entsteht ein leerer Abschnitt. Da hinein kommt wie im ersten Teil das HTML-Feld, dann der kopierte Code und Aktualisieren.

4. Veröffentlichen und einmal durchklicken

Nach Erneut veröffentlichen steht die Suche auf deiner Seite. Trag Datum und Personenzahl ein und klick auf Suchen: Der Gast landet auf deiner Buchungsseite, und die Suche ist dort schon ausgefüllt.

Zwei Stellen, an denen es sonst hakt

Gib dem HTML-Feld eine eigene Spalte. Das empfiehlt der Baukasten selbst, und der Grund ist praktisch: Ein hoher Inhalt legt sich im Editor über das Feld. Danach lässt es sich nicht mehr anklicken, und der einzige Weg zurück führt über die Spalte, in der es sitzt. Eine Buchungsmaschine ist genau so ein hoher Inhalt. Wer sie in eine eigene Spalte setzt, kann sie jederzeit wieder bearbeiten oder entfernen.

Alle Adressen im Code müssen mit https beginnen. Darauf weist Smoobu im Code-Fenster selbst hin, und es ist kein Formalismus: Ein Skript über eine unverschlüsselte Adresse wird vom Browser auf einer verschlüsselten Seite blockiert, und zwar kommentarlos. Der Einbettungscode von BineBoost erfüllt das von Haus aus.

Was mit Smoobus eigener Buchungsstrecke passiert

Auf der Book-now-Seite ersetzt du sie, überall sonst bleibt sie stehen. Wenn du magst, kannst du auch eine zusätzliche Seite anlegen und die Book-now-Seite unangetastet lassen. Wichtig ist nur, dass nicht beide auf derselben Seite untereinander stehen: Der Gast sieht sonst zwei Suchmasken, die verschiedene Preise ausrechnen, und weiß nicht, welche gilt.

An der Rolle von Smoobu ändert sich dadurch nichts. Der Kanalmanager bleibt Smoobu, der Kalender bleibt Smoobu, und die Synchronisation zu Booking.com, Airbnb und den übrigen Portalen läuft unverändert weiter. Eine Buchung über den Aufsatz wird über die offizielle Schnittstelle direkt im Smoobu-Kalender angelegt und blockiert den Zeitraum dort sofort. Der Aufsatz ist die Buchungsstrecke, nicht das System dahinter.

Wann sich der Aufwand lohnt

Wenn dir die Standard-Buchungsstrecke reicht, brauchst du nichts davon. Interessant wird der Einbau erst, wenn deine Preise nicht in das Standardmuster passen. Typische Fälle sind eine Ortstaxe mit Altersstaffeln, eigene Nachtpreise je Kinder-Altersgruppe, ein Belegungsaufpreis, der sich nach Saison unterscheidet, ein eigener Mehrwertsteuersatz je Preisposten oder eine höhere Anzahlung bei kurzfristiger Anreise. Das sind die Punkte, an denen Vermieter sonst zum Taschenrechner und zur Mail greifen, und jede Mail ist eine Buchung, die auch hätte durchlaufen können.

Häufige Fragen

Kann ich eine eigene Buchungsmaschine in die Smoobu-Website einbinden?

Ja. Der Smoobu Website Builder hat unter den Elementen ein HTML-Feld, in das sich beliebiger Code einfügen lässt. Smoobus eigene Hilfe nennt fremde Widgets und Formulare ausdrücklich als Zweck dafür. Der Einbau dauert wenige Minuten und braucht keine Programmierkenntnisse: Code kopieren, Element ziehen, einfügen, veröffentlichen.

Muss ich Smoobus eigene Buchungsstrecke vorher löschen?

Auf der Seite, auf der deine eigene stehen soll, ja. Die Seite Book now bringt Smoobus Buchungstool bereits mit. Stehen beide untereinander, sieht der Gast zwei Suchmasken mit verschiedenen Preisen und weiß nicht, welche gilt. Lösche die vorhandenen Inhalte über das Papierkorb-Symbol in der kleinen Leiste, bis nur noch ein leerer Abschnitt übrig ist. Auf allen anderen Seiten kann Smoobus Strecke bleiben.

Sehe ich die Buchungsmaschine schon im Editor?

Ja. Direkt nach dem Klick auf Aktualisieren steht sie im Editor, mit deinen echten Unterkünften und Preisen. Bleibt die Stelle ausnahmsweise leer, veröffentliche zuerst und sieh dir die echte Seite an, bevor du am Code suchst.

Gehört der Code in den Seiteninhalt oder in den Kopfbereich?

In den Seiteninhalt, über ein HTML-Feld an der Stelle, an der die Buchungsmaschine erscheinen soll. Der Kopfbereich nimmt nur bestimmte Bausteine an und ist für sichtbare Inhalte der falsche Ort. Smoobu weist im Code-Fenster außerdem darauf hin, dass fremde Skripte über HTTPS geladen werden müssen.

Warum landet meine Suche nicht auf meiner Buchungsseite?

Weil die Adresse der Buchungsseite fehlt. Sie steht in BineBoost unter Einbindung im Abschnitt Such-Widget und muss gespeichert sein, bevor du den Code kopierst. Ohne diesen Eintrag führt das Such-Widget den Gast auf unsere Adresse statt auf deine Seite. Das funktioniert zwar, liegt aber nicht auf deiner Website.

Brauche ich einen bestimmten Smoobu-Tarif dafür?

Für den Einbau selbst nicht, wohl aber für die Verbindung: Ein Buchungs-Aufsatz wie BineBoost arbeitet über Smoobus API, und der API-Zugang ist im Tarif Professional enthalten. Wer in Smoobu unter den Einstellungen gar keinen Bereich für API-Tokens findet, hat den Zugang nicht freigeschaltet.