Online-Buchung auf Tilda: das Klendr-Formular einbetten
Ein T123-HTML-Block — dein Buchungsformular direkt auf deiner Tilda-Seite.
So funktioniert es
Deine Klendr-Buchungsseite — Leistungen, freie Zeiten, Bestätigungen und Erinnerungen — erscheint in einem sicheren Rahmen direkt auf deiner eigenen Website. Kunden buchen, ohne deine Seite zu verlassen; jeder Termin landet sofort in deinem Klendr-Kalender.
Beginne mit deiner Buchungsseite in Klendr
Das Widget ist kein separates Formular, das du ausfüllst — es IST deine Klendr-Buchungsseite, angezeigt auf deiner Website. Baue also zuerst diese Seite: Leistungen mit Dauer und Preisen anlegen, Fotos hochladen, Begrüßungstext schreiben und im Branding-Editor Akzent- und Hintergrundfarbe, Schrift und Kartenstil wählen. Alles ist änderbar: Farben, Schriften, Titelbild und Logo, Leistungsliste und Beschreibungen, Arbeitszeiten, sogar eine zweite Sprache. Erst danach kopierst du den Einbettungscode.
Schritt-für-Schritt-Einrichtung
Einbettungscode kopieren
In Klendr öffne Integrationen → „Auf deiner Website einbetten“ und kopiere deinen persönlichen Code — dein Buchungslink ist schon eingesetzt.
HTML-Block in Tilda hinzufügen
Klicke im Tilda-Editor auf „+ Block hinzufügen“, öffne die Kategorie „Sonstiges“ und wähle T123 „HTML-Code“.
Code einfügen
Öffne das Content-Panel des Blocks, füge den Code ein und speichere.
Veröffentlichen
Veröffentliche die Seite. Das Formular lädt deine Leistungen und freien Zeiten und passt seine Höhe automatisch an.
Der Einbettungscode
<iframe src="https://klendr.me/book/YOUR-SALON?embed=1"
style="width:100%;border:0;height:640px" title="Booking" id="klendr-frame"></iframe>
<script>(function(){var f=document.getElementById('klendr-frame');
function tell(){try{f.contentWindow.postMessage(
{type:'klendr:hostlang',lang:document.documentElement.lang||''},'*');}catch(e){}}
addEventListener('message',function(e){var d=e.data;if(!d)return;
if(d.type==='klendr:height'&&d.height){f.style.height=(d.height+8)+'px';}
if(d.type==='klendr:ready'){tell();}});
f.addEventListener('load',tell);})();</script>Ersetze YOUR-SALON durch den Namen deiner Buchungsseite. Deinen persönlichen, fertigen Code findest du in Klendr → Integrationen → „Auf deiner Website einbetten“.
In welcher Sprache erscheint das Formular?
Standardmäßig folgt das Widget deiner Website: der Code übergibt ihm die Seitensprache, auf einer deutschen Seite erscheint also ein deutsches Formular. Gibt die Seite keine Sprache an, nutzt das Widget die Sprache deines Salons aus Klendr. Fest einstellen? In Klendr → Integrationen → „Einbettungscode“ vor dem Kopieren eine Sprache wählen — sie wird als &lang=xx an den Link angehängt.
So sieht es aus
Auf der Website (Desktop)
Auf dem Handy
Die Screenshots zeigen beispielhaft ein Farbschema. Dein Formular übernimmt deine Farben, Schrift und Leistungen — stelle sie in Klendr ein, das Widget folgt sofort.
Häufige Fragen
Funktioniert es im kostenlosen Tilda-Tarif?
Der T123-Block erfordert einen bezahlten Tilda-Tarif — eine Tilda-Beschränkung, keine von Klendr.
Passt sich das Formular der Seitenbreite an?
Ja — der Rahmen nimmt die volle Blockbreite ein und wächst automatisch in der Höhe.
Wohin gehen die Buchungen?
In deinen Klendr-Kalender, mit den üblichen Bestätigungen und Erinnerungen an den Kunden.