Aigonex Termine in Webflow einbinden

🗓️ Aigonex Termine · Webflow

Termine direkt aus
deiner Webflow-Seite.

Ein kleines Code-Snippet, fertig. Kein Plugin, kein Build-Schritt — nur ein Embed-Block, in den du den Snippet einfügst. Inline auf der Seite oder als Modal-Overlay, wahlweise.

Voraussetzungen

Was du brauchst

  • Einen Aigonex-Termine-Account mit mindestens einem aktiven Event-Typ. Hier kostenlos starten, falls noch nicht vorhanden.
  • Einen Webflow-Plan, der Custom Code erlaubt (CMS-Plan oder höher). Auf dem Starter-Plan funktionieren Embed-Blöcke nicht.
  • Deine Buchungs-URL — das letzte Stück nach termine.aigonex.de/. Beispiel: bei termine.aigonex.de/alice/erstgespraech ist das alice/erstgespraech.

Variante 1 · Inline

Inline-Widget einfügen

Das Buchungs-Widget erscheint direkt auf der Seite, an der Stelle des Embed-Blocks. Empfohlen, wenn die Buchung Teil eines Kontaktbereichs ist.

  1. In Webflow den Designer öffnen und zur Zielseite navigieren.
  2. Aus dem Add-Panel einen Embed-Block an die gewünschte Stelle ziehen.
  3. Im Embed-Editor folgendes Snippet einfügen, USERNAME/SLUG durch deine echte Buchungs-URL ersetzen:
<script src="https://termine.aigonex.de/embed.js"
        data-event="USERNAME/SLUG"
        data-mode="inline"
        data-lang="de"></script>
  1. Embed-Editor speichern, dann Publish in Webflow.

Das Widget passt seine Höhe automatisch an den Inhalt an (Slot-Liste → Formular → Bestätigung), kein manuelles Resize-Handling nötig.

Variante 2 · Modal

Modal-Button — Buchung im Overlay

Statt einer Inline-Anzeige erscheint ein Button. Beim Klick öffnet sich das Widget in einem Overlay. Empfohlen für CTAs in Hero-Bereichen oder Footer-Banner.

<script src="https://termine.aigonex.de/embed.js"
        data-event="USERNAME/SLUG"
        data-mode="modal"
        data-button-label="Termin buchen"
        data-lang="de"></script>

Der Button kommt mit Default-Styling (Indigo-Hintergrund, weiße Schrift, abgerundet). In Webflow kannst du data-button-label für den Text anpassen oder den Button mit deinem eigenen CSS überschreiben (Class-Selector im Designer auf den entstandenen <button>).

Bonus

Felder vorausfüllen

Wenn die Webflow-Seite den Gast schon kennt (z. B. nach einem Newsletter-Klick oder aus einem Form-Submit), kannst du Felder im Widget vorausfüllen — der Gast bestätigt nur noch.

<script src="https://termine.aigonex.de/embed.js"
        data-event="USERNAME/SLUG"
        data-mode="inline"
        data-first-name="Anna"
        data-last-name="Müller"
        data-email="anna@beispiel.de"></script>

Für dynamische Pre-Fill-Werte (z. B. aus URL-Parametern auf der Webflow-Seite) den Embed-Block durch ein Custom Code-Element ersetzen und das <script> per JavaScript zusammenbauen. Wir haben dafür ein Beispiel — frag uns gerne per E-Mail an.

Häufige Fragen

FAQ

Sieht der Gast die Marke „Aigonex“?

Im Embed-Modus zeigt das Widget nur den Buchungsdialog — kein Header, kein Footer. Die umgebende Seite (also deine Webflow-Site) bestimmt die Optik drumherum.

Ist das DSGVO-konform?

Ja. Die Buchungsdaten laufen ausschließlich über termine.aigonex.de, Hosting in Deutschland. Für die Webflow-Integration empfehlen wir einen kurzen Hinweis in der Datenschutzerklärung (Vorlagentext bei uns auf Anfrage).

Kann ich mehrere Event-Typen auf derselben Seite einbinden?

Ja. Jedes Script-Tag ist eigenständig — füge so viele Embed-Blöcke ein, wie du Event-Typen anbieten willst, jeweils mit eigenem data-event.

Erstmal ausprobieren? 30 Tage kostenlos.

Kostenlos starten
← Mehr zu Aigonex Termine