Integrationen

NueForm verbindet sich über Data Nodes mit jedem Dienst, der eine API hat — deinem universellen HTTP-Connector. Statt eingeschränkter vorgefertigter Integrationen bekommst du die volle Kontrolle darüber, wie deine Formulardaten zu externen Diensten fließen.

Diese Anleitung zeigt Schritt für Schritt die Einrichtung der beliebtesten Automatisierungsplattformen sowie die direkte API-Integration.

Zapier (8.000+ Apps)

Zapier verbindet deine Formulare mit über 8.000 Apps — darunter Google Sheets, Slack, Salesforce, HubSpot, Mailchimp und viele mehr.

So funktioniert es

Zapier nutzt einen Catch Hook-Trigger, der eine eindeutige Webhook-URL erzeugt. Dein Data Node sendet die Formulardaten an diese URL, und Zapier leitet sie an jede verbundene App weiter.

Schritt 1: Zap mit Webhooks-Trigger erstellen

1. Melde dich auf zapier.com an und klicke auf Create Zap.
2. Suche als Trigger nach Webhooks by Zapier.
3. Wähle das Ereignis Catch Hook.
4. Klicke auf Continue — Zapier generiert eine eindeutige Webhook-URL wie:
   textKopieren

   https://hooks.zapier.com/hooks/catch/123456/abcdef/
   

5. Kopiere diese URL — du brauchst sie für deinen Data Node.

Schritt 2: Data Node konfigurieren

1. Füge im NueForm-Builder einen Data Node in deinen Formular-Workflow ein.
2. Stelle Folgendes ein:
   • Methode: POST
   • URL: Füge die Zapier-Webhook-URL ein
   • Header:
     jsonKopieren

     {
       "Content-Type": "application/json"
     }
     

   • Body: Bilde deine Formularfelder im JSON-Body ab:
     jsonKopieren

     {
       "name": "{{full_name}}",
       "email": "{{email}}",
       "message": "{{message}}",
       "submitted_at": "{{timestamp}}"
     }
     

   • Silent Mode: Aktivieren (empfohlen — kein Ladebildschirm für die befragte Person)

Schritt 3: Verbindung testen

1. Klicke in Zapier auf Test trigger — es wartet auf eine Anfrage.
2. Öffne in NueForm die Vorschau deines Formulars und übermittle eine Testantwort.
3. Zapier sollte die Testdaten erkennen und deine Formularfelder anzeigen.

Schritt 4: Aktion hinzufügen

1. Klicke zurück in Zapier auf +, um eine Aktion hinzuzufügen.
2. Wähle deine Ziel-App (z. B. Google Sheets, Slack, HubSpot).
3. Ordne die Felder aus deinen Webhook-Daten der Aktion zu.
4. Teste und veröffentliche deinen Zap.

Beispiel: Formular → Google Sheets

{
  "name": "{{full_name}}",
  "email": "{{email_address}}",
  "company": "{{company_name}}",
  "budget": "{{budget_range}}",
  "source": "NueForm Contact Form"
}

Damit landet jede Formularübermittlung automatisch als neue Zeile in Google Sheets.

n8n (400+ Nodes)

n8n ist eine Open-Source-Plattform für Workflow-Automatisierung mit über 400 eingebauten Nodes. Sie lässt sich selbst hosten oder über n8n Cloud nutzen.

So funktioniert es

n8n verwendet einen Webhook-Node als Workflow-Trigger. Er erzeugt eine Endpunkt-URL, die dein Data Node aufruft, um den Workflow zu starten.

Schritt 1: n8n-Workflow mit Webhook-Trigger erstellen

1. Melde dich bei deiner n8n-Instanz an (Cloud oder selbst gehostet).
2. Erstelle einen neuen Workflow.
3. Klicke auf Add first step und wähle On webhook call.
4. In den Einstellungen des Webhook-Nodes:
   • Setze die HTTP Method auf POST
   • Notiere dir die Test URL (zum Testen) und die Production URL (für den Livebetrieb)
   • Die Production URL sieht so aus:
     textKopieren

     https://your-instance.app.n8n.cloud/webhook/abc-123-def
     

5. Klicke auf Listen for test event, um den Lauschmodus zu starten.

Schritt 2: Data Node konfigurieren

1. Füge einen Data Node in deinen NueForm-Workflow ein.
2. Konfiguriere ihn:
   • Methode: POST
   • URL: Füge die n8n-Webhook-URL ein (Test URL zum Testen, Production URL im Livebetrieb)
   • Header:
     jsonKopieren

     {
       "Content-Type": "application/json"
     }
     

   • Body:
     jsonKopieren

     {
       "respondent_email": "{{email}}",
       "answers": {
         "name": "{{name}}",
         "feedback": "{{feedback}}",
         "rating": "{{satisfaction_rating}}"
       }
     }
     

   • Silent Mode: Aktivieren

Schritt 3: n8n-Workflow bauen

Sobald der Webhook-Node Daten empfängt, füge beliebige weitere Nodes hinzu:

• Google Sheets — Antworten in einer Tabelle protokollieren
• Slack — Eine Benachrichtigung an dein Team senden
• Email (SMTP) — Eine Bestätigungs-E-Mail verschicken
• HTTP Request — Eine weitere API aufrufen
• IF — Daten abhängig von Formularantworten verzweigen

Schritt 4: Aktivieren

1. Teste, indem du ein Formular übermittelst und prüfst, ob n8n die Daten erhält.
2. Wechsle die Webhook-Node-URL von Test auf Production.
3. Aktiviere den Workflow (Umschalter oben rechts).
4. Aktualisiere die URL in deinem Data Node auf die Production URL.

Make (3.000+ Apps)

Make (früher Integromat) ist eine visuelle Automatisierungsplattform mit über 3.000 App-Integrationen.

So funktioniert es

Make nutzt ein Custom Webhook-Modul als Szenario-Trigger. Es erzeugt eine URL, an die dein Data Node die Daten sendet.

Schritt 1: Make-Szenario erstellen

1. Melde dich auf make.com an und erstelle ein neues Szenario.
2. Klicke auf den +-Button und suche nach Webhooks.
3. Wähle Custom webhook.
4. Klicke auf Add, um einen neuen Webhook zu erstellen.
5. Gib ihm einen Namen (z. B. „NueForm Contact Form").
6. Make generiert eine URL wie:
   textKopieren

   https://hook.make.com/abcdefghijk123456
   

7. Kopiere diese URL.

Schritt 2: Data Node konfigurieren

1. Füge einen Data Node in deinen NueForm-Workflow ein.
2. Stelle ein:
   • Methode: POST
   • URL: Füge die Make-Webhook-URL ein
   • Header:
     jsonKopieren

     {
       "Content-Type": "application/json"
     }
     

   • Body:
     jsonKopieren

     {
       "form_name": "Contact Form",
       "name": "{{full_name}}",
       "email": "{{email}}",
       "phone": "{{phone_number}}",
       "inquiry_type": "{{inquiry_type}}"
     }
     

   • Silent Mode: Aktivieren

Schritt 3: Datenstruktur ermitteln

1. Klicke in Make auf Run once am Webhook-Modul.
2. Übermittle eine Testantwort in NueForm.
3. Make erkennt die Datenstruktur und ordnet die Felder automatisch zu.

Schritt 4: Module hinzufügen und aktivieren

1. Füge deine Zielmodule hinzu (Google Sheets, CRM, E-Mail usw.).
2. Ordne die Webhook-Datenfelder jedem Modul zu.
3. Schalte die Szenario-Planung ein.

IFTTT (1.000+ Dienste)

IFTTT (If This Then That) verbindet sich mit über 1.000 Diensten — darunter Smart-Home-Geräte, soziale Medien und Produktivitäts-Apps.

So funktioniert es

IFTTT nutzt den Webhooks-Dienst mit dem Trigger Receive a web request. Dein Data Node feuert ein Ereignis an die Webhook-URL von IFTTT.

Schritt 1: IFTTT-Webhooks einrichten

1. Gehe auf ifttt.com und erstelle ein neues Applet.
2. Suche bei „If This" nach Webhooks.
3. Wähle Receive a web request.
4. Gib einen Ereignisnamen ein (z. B. nueform_submission).
5. Wähle bei „Then That" deinen Aktionsdienst.

Schritt 2: Webhook-URL abrufen

1. Gehe auf ifttt.com/maker_webhooks.
2. Klicke auf Documentation.
3. Du siehst deinen eindeutigen Key und das URL-Format:
   textKopieren

   https://maker.ifttt.com/trigger/{event}/with/key/YOUR_KEY
   

4. Ersetze {event} durch deinen Ereignisnamen:
   textKopieren

   https://maker.ifttt.com/trigger/nueform_submission/with/key/abc123xyz
   

Schritt 3: Data Node konfigurieren

IFTTT Webhooks akzeptiert bis zu 3 Werte (value1, value2, value3):

1. Füge einen Data Node in deinen NueForm-Workflow ein.
2. Stelle ein:
   • Methode: POST
   • URL: Deine IFTTT-Webhook-URL
   • Header:
     jsonKopieren

     {
       "Content-Type": "application/json"
     }
     

   • Body:
     jsonKopieren

     {
       "value1": "{{full_name}}",
       "value2": "{{email}}",
       "value3": "{{message}}"
     }
     

   • Silent Mode: Aktivieren

Direkte API-Integration

Für maximale Kontrolle rufst du jede REST-API direkt auf — ganz ohne Middleware.

Beispiel: An dein eigenes Backend senden

Method: POST
URL: https://api.yourapp.com/form-submissions
Headers:
{
  "Content-Type": "application/json",
  "Authorization": "Bearer YOUR_API_KEY"
}
Body:
{
  "form_id": "contact-form",
  "data": {
    "name": "{{name}}",
    "email": "{{email}}",
    "message": "{{message}}"
  }
}

Beispiel: Zu einem CRM hinzufügen

Method: POST
URL: https://api.hubspot.com/crm/v3/objects/contacts
Headers:
{
  "Content-Type": "application/json",
  "Authorization": "Bearer YOUR_HUBSPOT_TOKEN"
}
Body:
{
  "properties": {
    "firstname": "{{first_name}}",
    "lastname": "{{last_name}}",
    "email": "{{email}}",
    "company": "{{company}}"
  }
}

Beispiel: Slack-Nachricht senden

Method: POST
URL: https://hooks.slack.com/services/T00/B00/xxxx
Headers:
{
  "Content-Type": "application/json"
}
Body:
{
  "text": "New form submission from {{name}} ({{email}}): {{message}}"
}

Tipps & Best Practices

Nutze den Silent Mode

Aktiviere für die meisten Integrationen den Silent Mode, damit die befragte Person keine Ladeanzeige sieht. Die Anfrage läuft im Hintergrund.

Fehlerbehandlung

• Ist der externe Dienst nicht erreichbar, schlägt die Data-Node-Anfrage fehl. Setze ein vernünftiges Timeout (5-10 Sekunden).
• Für kritische Integrationen kannst du NueForms eingebaute Webhooks als Backup nutzen — sie wiederholen den Versand bei Fehlern.

Variablen-Mapping

Nutze die {{variable_name}}-Syntax (doppelte geschweifte Klammern) in Anfrage-Bodys, um Formularantworten einzusetzen. Einfache Klammern {variable_name} funktionieren in URLs und Headern.

Die vollständige Referenz findest du unter Variablen.

Testen

1. Aktiviere während der Entwicklung den Debug Mode an deinem Data Node, um Anfrage und Antwort vollständig zu sehen.
2. Nutze einen Dienst wie webhook.site, um die exakte Payload zu inspizieren, die dein Data Node sendet.
3. Deaktiviere den Debug Mode vor dem Veröffentlichen.

Verwandte Themen

• Data Nodes — Vollständige Data-Node-Konfigurationsreferenz
• Variablen — Syntax der Variableninterpolation
• Webhooks — Webhook-Alternative nach der Übermittlung