Anleitung

⌘K
  1. Start
  2. Dokumente
  3. Anleitung
  4. Webformulare ✅
  5. Terminbuchung – Tandem

Terminbuchung – Tandem

🪂 Tandem-Buchungssystem

Dokumentation für Nutzer und Administratoren

📋 Übersicht

Das Tandem-Buchungssystem ist ein modernes Online-Buchungsformular für Tandemsprünge. Es ermöglicht Kunden, eigenständig Termine zu buchen, Video-Optionen zu wählen und Gutscheine einzulösen – optional mit integrierter Online-Zahlung via Stripe.
🆕 Neue Buchung
Kunden können einen neuen Tandemsprung buchen: Teilnehmerzahl wählen, Termin aussuchen, persönliche Daten eingeben und Video-Optionen auswählen.
🔄 Umbuchung
Bestehende Buchungen können per Buchungscode auf einen anderen Termin umgebucht werden – ohne erneute Eingabe aller Daten.

Hauptfunktionen

📅 Kalender-Integration
Interaktiver Kalender zeigt verfügbare Termine mit freien Plätzen, Preisen und Absprunghöhen.
👥 Multi-Gast-Buchung
Bis zu 5 Tandemgäste können gleichzeitig gebucht werden – jeder mit eigenen Daten und Optionen.
💳 Online-Zahlung
Optionale Stripe-Integration für sichere Zahlungen per Kreditkarte, PayPal, Klarna u.v.m.
🎫 Gutschein-System
Gutscheincodes können validiert und automatisch vom Preis abgezogen werden.
🎥 Video-Optionen
Flexible Video-Pakete zur Auswahl: Handkamera, Kameraspringer, Fotos oder Kombipakete.
💾 Entwurf speichern
Bei Unterbrechung wird der Fortschritt automatisch gespeichert und kann fortgesetzt werden.

🔗 Integration (WordPress)

Das Buchungsformular wird über einen HTML-Code in eine WordPress-Seite eingebunden. Die Konfiguration erfolgt zentral im Ninox-Backend über die Einstellungen.
⚙️ Einstellungen → Tandem-Buchungssystem
Im Ninox-Backend unter Einstellungen → Tab "Tandem-Buchungssystem" werden alle Optionen konfiguriert. Der JSON-Link für die Settings wird dort generiert.
📋 WordPress-Einbindung
Schritt 1: WordPress-Seite erstellen (z.B. /tandemsprung-buchen/)

Schritt 2: HTML-Block hinzufügen

Schritt 3: Einbettungscode einfügen

Schritt 4: Seite veröffentlichen
⚠️ Wichtig: Die data-settings-url ist der Ninox-Share-Link aus den Einstellungen. Dieser Link enthält alle Konfigurationsoptionen und muss für eure Datenbank angepasst werden.
💻 Einbettungscode
Der vollständige Code für die WordPress-Einbindung:
HTML Zum Kopieren markieren
📝 Parameter:
data-target: CSS-Selektor für das Ziel-Element
data-settings-url: Ninox-Share-Link mit Settings
data-body-url: URL zum HTML-Template (Standard beibehalten)

📝 Buchungsablauf (5 Steps)

Das Buchungsformular führt den Nutzer durch 5 übersichtliche Schritte. Der Fortschritt wird in einer Progress-Bar angezeigt.
3
4
5
Schritt 3 von 5: Teilnehmerzahl wählen
Progress-Bar im Buchungsformular
Buchungsart wählen
Neue Buchung oder Umbuchung per Buchungscode. Bei Umbuchung wird der bestehende Buchungscode abgefragt.
Buchungscode eingeben (nur bei Umbuchung)
Der 5-10 stellige Buchungscode wird validiert. Bei gültigem Code werden die Buchungsdaten geladen.
Teilnehmerzahl wählen
Auswahl von 1-5 Tandemgästen. Optional: Absprunghöhe (3000m / 4000m) wenn aktiviert.
Termin wählen
Interaktiver Kalender mit verfügbaren Slots. Zeigt freie Plätze, Preise und ggf. Absprunghöhe.
Kontaktdaten & Buchung abschließen
Persönliche Daten aller Gäste eingeben, Video-Optionen wählen, Gutscheincodes einlösen, AGB akzeptieren und Buchung absenden.
💡 Der Fortschritt wird automatisch im Browser gespeichert. Bei Unterbrechung kann die Buchung später fortgesetzt werden (siehe Entwurf speichern).

🚦 Auslastungsindikatoren Frontend

Der Kalender zeigt die Verfügbarkeit von Terminen durch farbige Indikatoren an. Die Farbe richtet sich nach der gewählten Teilnehmerzahl und den noch freien Plätzen.
🟢 Grün – Verfügbar
Genügend freie Plätze für die gewählte Teilnehmerzahl vorhanden. Der Tag ist anklickbar und zeigt die verfügbaren Slots mit Details (Uhrzeit, Preis, ggf. Höhe).
🟡 Gelb – Eingeschränkt
Es sind noch Plätze frei, aber nicht genug für die gewählte Teilnehmerzahl. Beispiel: 2 Plätze frei, aber 3 Gäste gewählt. Der Tag ist nicht buchbar mit dieser Anzahl.
🔴 Rot – Ausgebucht
Keine freien Plätze mehr verfügbar. Der Tag zeigt ein kleines Listen-Icon und bietet die Wartelisten-Funktion an (siehe unten).
💡 Dynamische Anpassung: Die Farben werden automatisch aktualisiert, wenn die Teilnehmerzahl geändert wird. Ein grüner Tag kann gelb werden, wenn mehr Gäste gewählt werden.
Mo
Di
Mi
Do
Fr
Sa
So
25
26
27
28
29
30
1
2
3
4
5
6
7
8📋
Kalender mit Auslastungsindikatoren

📋 Wartelisten-Funktion Frontend

Bei ausgebuchten Terminen (rot) können sich Interessenten auf eine Warteliste setzen lassen. Sie werden per E-Mail benachrichtigt, sobald ein Platz frei wird.
🔴 Klick auf ausgebuchten Tag
Wenn ein Nutzer auf einen roten (ausgebuchten) Tag klickt, öffnet sich ein Modal zur Wartelisten-Eintragung statt der normalen Slot-Auswahl.
📧 E-Mail-Eintragung
Der Nutzer gibt seine E-Mail-Adresse ein. Diese wird zusammen mit dem gewünschten Datum in der Datenbank gespeichert.
🔔 Benachrichtigung
Sobald ein Platz frei wird (z.B. durch Stornierung), kann der Interessent automatisch oder manuell benachrichtigt werden.
💡 Ein kleines Listen-Icon (📋) in der Ecke des roten Tages signalisiert, dass die Wartelisten-Funktion verfügbar ist.

📋 Warteliste

×

Dieser Termin ist leider ausgebucht. Trage dich auf die Warteliste ein und wir benachrichtigen dich, sobald ein Platz frei wird.

Gewünschter Termin: 08.12.2025
Wartelisten-Modal bei ausgebuchtem Termin

📏 Körpermaße & Alter Backend

Im Backend können Grenzwerte für Körpergröße, Gewicht und Mindestalter definiert werden. Das Formular validiert die Eingaben entsprechend und zeigt Fehlermeldungen bei Überschreitung.
EinstellungBeschreibungBeispiel
Körpergröße vonMindestgröße in cm140 cm
Körpergröße bisMaximalgröße in cm210 cm
Übergewicht oberhalb vonAb diesem Gewicht gilt Übergewicht-Aufschlag90 kg
Übergewicht bisMaximalgewicht für Buchung105 kg
MindestalterMindestalter für Tandemgäste10 Jahre
Körpermaße & Alter
Körpergröße von
140 cm
Körpergröße bis
210 cm
Übergewicht ab
90 kg
Übergewicht bis
105 kg
Mindestalter
10 Jahre
Einstellungen im Backend
💡 Hinweis: Bei Überschreitung des Maximalgewichts kann der Gast nicht buchen. Bei Übergewicht (zwischen den beiden Grenzen) wird ein Aufschlag berechnet, der in der Preistabelle definiert ist.

🎨 Anzeige-Optionen Backend

Diese Einstellungen steuern das Erscheinungsbild und die angezeigten Informationen im Buchungsformular.
🎨 Basisfarbe (MAINCOLOR)
Die Hauptfarbe des Formulars. Wird für Buttons, Fortschrittsbalken, Sidebar und Akzente verwendet. Die Textfarbe wird automatisch angepasst (hell/dunkel) basierend auf dem Kontrast.
#193459 (Standard)
👥 Max. Platzanzahl pro Buchung
Legt fest, wie viele Gäste maximal gleichzeitig gebucht werden können (1-5). Die Buttons werden entsprechend angezeigt und deaktiviert.
📊 Slotanzeige im Kalender
Definiert, welche Informationen im Kalender angezeigt werden:
  • Anzahl der freien Plätze
  • Tandempreis
  • Absetzhöhe
  • Dropzone

Formular-Felder ein-/ausblenden

3000m/4000m-Auswahl
Gewicht
Körpergröße
Adresse
Geburtsdatum
E-Mail für alle Tandemgäste
💡 Deaktivierte Felder werden im Formular ausgeblendet und sind nicht erforderlich.

🎥 Video-Optionen Backend

Die buchbaren Video-Optionen werden im Backend konfiguriert und als Dropdown im Buchungsformular angezeigt. Jede Option hat einen Namen und Preis.
📋 Buchbare Videooptionen
Die verfügbaren Optionen werden durch Mehrfachauswahl im Backend definiert:
ohne Video Hand-Kamera-Video - 99,00 € Hand-Kamera-Video und Fotos - 136,00 € Video durch Kameraspringer - 133,00 € Fotos durch Kameraspringer - 110,00 € Video und Fotos durch Kameraspringer - 170,00 €
💡 Format: Die Optionen werden im Format Name - Preis € angezeigt. Der Preis wird automatisch für die Preisberechnung extrahiert.
Dropdown im Buchungsformular

🎫 Gutschein-Einstellungen Backend

Das Gutschein-System ermöglicht die Validierung und Einlösung von Gutscheincodes. Optional können zwei Gutscheine pro Gast verwendet werden.
Gutschein erforderlich
Wenn aktiviert: Gutscheincode ist Pflichtfeld. Ohne gültigen Gutschein keine Buchung möglich.
Gutscheincodes überprüfen
Aktiviert die Live-Validierung von Gutscheincodes gegen die Ninox-Datenbank.
Zweiter Gutscheincode NEU
Ermöglicht die Eingabe von zwei Gutscheincodes pro Gast für sequentielle Verrechnung.
🔍 Gutschein-Validierung
Bei aktivierter Prüfung werden Gutscheincodes live validiert:
Gutschein gültig. Wert: 100,00 €
Ungültiger Gutscheincode.
Gutschein benötigt manuelle Prüfung.
⚠️ Duplikat-Prüfung: Derselbe Gutscheincode kann nicht mehrfach verwendet werden – weder für denselben Gast noch über verschiedene Gäste hinweg.

Zwei-Gutschein-Feature (SECOND_VOUCHER)

Bei aktiviertem Feature können für jeden Gast zwei Gutscheincodes eingegeben werden. Die Gutscheine werden sequentiell verrechnet:
🧾 Preisübersicht
Tandemsprung 4000m 209,00 €
Hand-Kamera-Video 136,00 €
🎫 Gutschein (ABC123) -100,00 €
🎫 Gutschein (XYZ789) -100,00 €
Gesamt 145,00 €
Sequentielle Gutschein-Verrechnung: Erst -100€, dann -100€

💳 Online-Zahlung (Stripe) Backend

Die optionale Stripe-Integration ermöglicht sichere Online-Zahlungen. Nach der Buchung wird der Kunde zu Stripe weitergeleitet und nach erfolgreicher Zahlung zurück zur Erfolgsseite.
Online-Zahlung
Aktiviert die Stripe-Zahlungsintegration. Der Submit-Button ändert sich zu "Zahlungspflichtig buchen".
Testmodus
Im Testmodus werden keine echten Zahlungen durchgeführt. Für Entwicklung und Tests.
🏢 Stripe-Konto
Die Zahlungen können an verschiedene Stripe-Konten geleitet werden:
💳 Unterstützte Zahlungsarten
Stripe unterstützt eine Vielzahl von Zahlungsmethoden:
📄 💳 💳 💳 🍎 G P K 🏦
🔗 Weiterleitung nach Buchung
Hier kann eine beliebige URL eingetragen werden, zu der der Kunde nach erfolgreicher Buchung/Zahlung weitergeleitet wird (z.B. eine Danke-Seite oder die Startseite).
https://deine-website.de/danke
💡 Preis = 0 €: Wenn der Gesamtpreis nach Gutscheinabzug 0 € beträgt, wird keine Zahlung durchgeführt und der Button zeigt "Verbindlich buchen".

⚖️ Rechtliches (AGB/Datenschutz) Backend

Im Backend können die Checkbox-Texte für AGB und Datenschutzerklärung angepasst werden. Diese werden im Buchungsformular als Pflichtfelder angezeigt.
📜 Checkbox-Text AGB
Text für die AGB-Checkbox mit Links zu den entsprechenden Seiten:
Die Allgemeinen Geschäftsbedingungen und die Widerrufsbelehrung wurden gelesen und werden akzeptiert.*
🔒 Checkbox-Text Datenschutz
Text für die Datenschutz-Checkbox:
Ich stimme der Speicherung der angegebenen Daten zur weiteren Verwendung zu und habe Kenntnis von der Datenschutzerklärung genommen – Widerruf jederzeit möglich an info@example.de*
💡 Die Texte unterstützen HTML für Links. Das Sternchen (*) kennzeichnet Pflichtfelder und wird automatisch hinzugefügt.

⏰ Fristen & Erinnerungen Backend

Diese Einstellungen steuern Stornierungsfristen, automatische Erinnerungen und Datenlöschung.
EinstellungBeschreibung
Stornierung erlauben bisAnzahl Tage vor dem Termin, bis zu dem storniert werden kann (z.B. 7 Tage)
MindestvorlaufMinimale Tage zwischen Buchung und Termin (z.B. 0 = gleicher Tag möglich)
Löschabfrage nachNach wie vielen Monaten abgeschlossene Buchungen zur Löschung vorgeschlagen werden (z.B. 12 Monate)
📧 Automatische Terminerinnerung
Wenn aktiviert, werden Kunden automatisch per E-Mail an ihren Termin erinnert.
Automatische Terminerinnerung
Frist für Erinnerung 5 Tag(e)
⭐ Automatische Bewertungsmail
Nach dem Sprung wird automatisch eine E-Mail mit Bewertungslink verschickt.
Bewertungsmail aktiviert
Erinnerungsfrist: 2 Tage
Bewertungslink: https://g.page/r/...
💡 BV-Link in Terminbestätigung: Wenn aktiviert, wird in der Terminbestätigung ein Link zum Beförderungsvertrag eingefügt.

🧮 Preisberechnung Frontend

Die Preis-Sidebar zeigt in Echtzeit die Kosten basierend auf Teilnehmern, Video-Optionen und eingelösten Gutscheinen. Sie wird ab Schritt 5 eingeblendet.
📊 Preiskomponenten
Der Gesamtpreis setzt sich zusammen aus:
  • Tandemsprung-Grundpreis (je nach Höhe: 3000m/4000m)
  • Video-Option (falls gewählt)
  • Übergewicht-Aufschlag (falls zutreffend)
  • Gutschein-Abzüge (sequentiell verrechnet)
👥 Multi-Gast-Berechnung
Bei mehreren Gästen wird für jeden Gast separat berechnet:
  • Individueller Sprungpreis
  • Individuelle Video-Option
  • Individuelle Gutscheine
  • Zwischensumme pro Gast
💡 Änderungen werden sofort in der Sidebar aktualisiert – ohne Neuladen der Seite.
🧾 Preisübersicht
Gast 1 (Max Mustermann)
Tandemsprung 4000m 209,00 €
Hand-Kamera-Video 136,00 €
🎫 Gutschein -100,00 €
Zwischensumme 245,00 €
Gast 2 (Erika Musterfrau)
Tandemsprung 4000m 209,00 €
ohne Video 0,00 €
Zwischensumme 209,00 €
Gesamtpreis 454,00 €
Preis-Sidebar mit Multi-Gast-Berechnung

💾 Entwurf speichern & fortsetzen Frontend

Das Buchungsformular speichert den Fortschritt automatisch im Browser. Bei Unterbrechung oder Seitenwechsel kann die Buchung später fortgesetzt werden.
💾 Was wird gespeichert?
  • Buchungsart (Neu/Umbuchung)
  • Gewählter Termin/Slot
  • Teilnehmerzahl
  • Alle persönlichen Daten
  • Video-Optionen
  • Gutscheincodes
  • Aktueller Schritt
🔄 Wiederherstellung
Bei erneutem Besuch der Buchungsseite:
  • Dialog fragt "Entwurf fortsetzen?"
  • Alle Daten werden wiederhergestellt
  • Gutscheine werden re-validiert
  • Preisberechnung wird aktualisiert
💾
Entwurf gefunden
Du hast eine unfertige Buchung. Möchtest du fortfahren?
Dialog bei vorhandenem Entwurf
⚠️ Hinweis: Der Entwurf wird im Browser-Speicher (localStorage) gespeichert. Bei Löschen der Browserdaten geht der Entwurf verloren.

⚙️ Weitere Einstellungen Backend

📧 BV-Link in Terminbestätigung
Fügt einen Link zum Beförderungsvertrag in die Terminbestätigung ein.
💰 Abfrage Basis-Tandempreis
Zeigt den Basis-Tandempreis im Buchungsformular an.
📧 E-Mail für alle Gäste
Fragt E-Mail-Adressen für alle Tandemgäste ab, nicht nur für den Hauptkontakt.
💡 Geburtsdatum-Hinweis: Bei deaktivierter Abfrage des Geburtsdatums kann es bei wiederholten Buchungen ohne Nutzung des Buchungscodes vermehrt zum Anlegen doppelter Kundendatensätze kommen, da durch die Eingabe von E-Mail-Adresse und Telefonnummer oft keine eindeutige Übereinstimmung möglich ist.
Schlagwörter , , , ,