> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.fotostudio.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).
# Wie verknüpfe ich meine eigenen Formulare mit Fotostudio?
# Eigenes Formular mit Fotostudio verbinden
Du hast bereits ein Kontaktformular auf deiner Website (WordPress, Webflow, Wix, HTML…) und möchtest, dass die Einsendungen direkt in Fotostudio landen? Diese Anleitung erklärt dir wie.
**Der wichtigste Vorteil:** Dein Formular bleibt 100% nach deinen Wünschen gestaltet — deine Farben, dein Layout, dein Stil. Fotostudio empfängt die Daten im Hintergrund, ohne jemals auf deiner Website zu erscheinen.
> Diese Methode unterscheidet sich vom **iframe**: Beim iframe wird das Fotostudio-Formular auf deiner Website angezeigt. Hier schickt *dein* bestehendes Formular die Daten an Fotostudio.
## 1. Deine Verbindungs-URL abrufen
Jedes Fotostudio-Formular hat eine eindeutige URL. Wenn dein Formular Daten an diese URL sendet, erstellt Fotostudio automatisch den Lead, löst deine Workflows aus und sendet dir die gewohnte Benachrichtigung.
So findest du diese URL:
1. Gehe zu **Einstellungen → Formulare**
2. Klicke auf das betreffende Formular
3. Öffne **Code abrufen → Eigenes Formular verbinden**
Dieses Popup generiert auch einen vollständigen HTML-Code, der direkt auf deiner Website eingefügt werden kann. Er enthält bereits alle Felder, die du in deinem Fotostudio-Formular konfiguriert hast, mit den richtigen `name`-Attributen. Dies ist der einfachste Ausgangspunkt, wenn du von vorne anfängst oder die genauen Feldnamen überprüfen möchtest.
Deine URL sieht so aus:
```
https://app.fotostudio.io/f/abc123def456...
```
## 2. Deine Felder benennen
Fotostudio erkennt die Felder deines Formulars anhand ihres `name`-Attributs. Verwende folgende Namen:
| `name`-Attribut | Gespeicherte Angabe |
| ---- |
| `email` | E-Mail |
| `firstname` | Vorname |
| `lastname` | Nachname |
| `phone` | Telefon |
| `message` | Nachricht |
| `company` | Unternehmen |
| `start_date` | Aufnahmedatum (`YYYY-MM-DD`) |
| `project_type` | ID des Aufnahmetyps |
| `place` | Aufnahmeort |
Der im Popup generierte Code (Schritt 1) listet genau die für dein Formular verfügbaren Felder auf.
**Hast du andere Felder?** Kein Problem. Nicht erkannte Felder werden automatisch als Notiz am Kontakt gespeichert (z. B. wird ein Feld `budget` so wie es ist gespeichert). Es geht nichts verloren.
## 3. Anti-Spam hinzufügen (empfohlen)
Füge dieses unsichtbare Feld zu deinem Formular hinzu. Bots füllen es aus, Menschen nicht. Fotostudio lehnt Einsendungen, bei denen dieses Feld ausgefüllt ist, stillschweigend ab.
```html
```
## 4. Einrichtung je nach Plattform
### Eigene HTML-Website
Die einfachste Methode. Füge `action` und `method` zu deinem `
```
Nach dem Absenden wird der Besucher zur URL weitergeleitet, die unter **Formulareinstellungen → Weiterleitungs-URL** konfiguriert ist.
### Webflow
1. Wähle deinen **Form**-Block aus.
2. Gib in den Formulareinstellungen deine Fotostudio-URL als **Action** ein.
3. Stelle die **Method** auf `POST`.
4. Benenne jedes Feld (das **Name**-Attribut) gemäß der obigen Tabelle.
5. Füge ein Textfeld mit dem Namen `_gotcha` hinzu, setze seinen Standardwert auf leer und blende es über die Sichtbarkeitsoptionen aus.
### WordPress — Gravity Forms
1. Erstelle dein Formular mit den gewünschten Feldern.
2. Gehe zu **Einstellungen → Webhooks** (erfordert das Gravity Forms Webhooks-Add-on).
3. Füge einen neuen Webhook hinzu:
* **URL**: Deine Fotostudio-URL
* **Methode**: POST
* **Format**: Form
4. Weise im Abschnitt **Felder** jedem Gravity Forms-Feld seinen Fotostudio-Namen zu (`email`, `firstname` usw.).
### WordPress — WPForms
1. Erstelle dein Formular.
2. Füge unter **Einstellungen → Webhooks** (WPForms Pro) einen Webhook hinzu:
* **Anfrage-URL**: Deine Fotostudio-URL
* **Methode**: POST
3. Weise jedem Feld seinen Fotostudio-Namen zu.
### WordPress — Contact Form 7
CF7 erlaubt es nicht, die Aktion nativ zu ändern. Installiere das Plugin **CF7 to API** und konfiguriere die Fotostudio-URL in dessen Einstellungen. Benenne deine Felder gemäß der obigen Tabelle.
### Wix
Wix erlaubt es nicht, die Aktion eines nativen Formulars zu ändern. Verwende **Wix Automations**:
1. Erstelle dein Formular in Wix.
2. Gehe zu **Automatisierungen → Neue Automatisierung**.
3. Auslöser: **Formular gesendet**.
4. Aktion: **Webhook senden** → gib deine Fotostudio-URL ein.
5. Weise die Wix-Felder den Fotostudio-Namen im Anfrage-Body zu.
### Typeform / Tally
Diese Tools verfügen über eine native Webhook-Integration:
* **Typeform**: Verbinden → Webhooks → Deine Fotostudio-URL eingeben
* **Tally**: Integrationen → Webhook → Deine Fotostudio-URL eingeben
Weise jede Frage ihrem entsprechenden Fotostudio-Namen zu.
### Squarespace
Squarespace erlaubt es in den Basisplänen nicht, die Aktion eines nativen Formulars zu ändern. Zwei Möglichkeiten:
* **Business-Plan oder höher**: Verwende einen HTML-Code-Block mit einem benutzerdefinierten Formular (siehe Abschnitt *Eigene HTML-Website* oben).
* **Alle Pläne**: Verwende Make oder Zapier, um Einsendungen an Fotostudio weiterzuleiten.
## FAQ
**Sind doppelte Einsendungen geschützt?**
Ja. Wenn dieselbe IP-Adresse dasselbe Formular zweimal innerhalb von 30 Sekunden absendet (z. B. Doppelklick auf die Schaltfläche), wird die zweite Einsendung stillschweigend ignoriert.
**Funktioniert mein iframe weiterhin?**
Ja, beide Methoden (iframe und externe Verbindung) sind vollständig unabhängig voneinander. Eine beeinflusst die andere nicht.
**Kann ich den Besucher nach dem Absenden weiterleiten?**
Ja. Konfiguriere die **Weiterleitungs-URL** in den Einstellungen deines Fotostudio-Formulars. Der Besucher wird nach dem Absenden deines externen Formulars dorthin weitergeleitet.