How to Automate Form Submissions Into Your CRM Using n8n Webhooks
Automating form submissions directly into your CRM eliminates manual data entry and ensures real-time lead routing. This technical guide shows you how to capture form data using an n8n Webhook node, parse the payload, and upsert the contact into your CRM.
Prerequisites
- A running n8n instance (self-hosted or Cloud).
- A form builder (e.g., Typeform, Elementor, Webflow, or a custom HTML form) capable of sending HTTP POST requests.
- API access or credentials for your target CRM (e.g., HubSpot, Salesforce, Pipedrive, or ActiveCampaign).
Step 1: Configure the n8n Webhook Trigger
Create a new workflow in n8n and add a Webhook node as your starting trigger. Configure the node parameters as follows:
- HTTP Method:
POST - Path:
form-lead-capture - Response Mode:
onReceived(this returns an immediate HTTP 200 status code to the form provider, preventing timeout errors). - Response Code:
200
Copy the Test URL provided by the node. You will use this URL to send a test payload from your form provider.
Step 2: Connect Your Form to the Webhook
Configure your form builder's webhook settings to point to the n8n Test URL. If you are using a custom frontend, use the following JavaScript fetch execution to dispatch the payload on form submission:
fetch('https://your-n8n-instance.com/webhook-test/form-lead-capture', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
email: 'lead@example.com',
firstName: 'Jane',
lastName: 'Doe',
company: 'Acme Corp',
phone: '+15550199'
})
});
Trigger a test submission from your form. In n8n, click Listen for test event to capture the incoming JSON schema. Once captured, the schema will be available in the workflow UI for drag-and-drop mapping.
Step 3: Map and Format the Data
Add an Edit Fields (Set) node immediately after the Webhook node. This step normalizes the incoming data schema to match your CRM's expected API payload structure.
- Add a string value for First Name using the expression:
{{ $json.body.firstName }} - Add a string value for Last Name using the expression:
{{ $json.body.lastName }} - Add a string value for Email using the expression:
{{ $json.body.email }}
This step ensures that even if you change your form provider later, you only need to update the mappings in this single node rather than modifying your entire CRM integration logic.
Step 4: Push Data to Your CRM
Add your CRM's native node (e.g., HubSpot, Salesforce, or Pipedrive) to the workflow. If your
Need this done fast? order this automation on Kwork.
I take on freelance fixes and builds in this area.