Webflow to Airtable, clean leads in the right table
Webflow forms are supposed to be the easy part. Then you add a second form, reuse a template, or clone a page, and suddenly submissions start landing in the wrong place.
This Webflow Airtable leads automation hits marketers first because follow-up speed matters. But agency owners and ops folks feel it too, because messy lead routing turns into a daily cleanup job.
You’ll set up an n8n workflow that keeps Webflow submissions organized in Airtable, even when form names collide, so every lead shows up clean and ready to use.
How This Automation Works
Here’s the complete workflow you’ll be setting up:
n8n Workflow Template: Webflow to Airtable, clean leads in the right table
flowchart LR
subgraph sg0["Webflow Submission Flow"]
direction LR
n0["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/webflow.svg' width='40' height='40' /></div><br/>Webflow Submission Trigger"]
n1@{ icon: "mdi:swap-vertical", form: "rounded", label: "Prepare form submission for ..", pos: "b", h: 48 }
n2["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/code.svg' width='40' height='40' /></div><br/>Get Form Index Reference Tab.."]
n3@{ icon: "mdi:swap-horizontal", form: "rounded", label: "Does Index Reference Table E..", pos: "b", h: 48 }
n4["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/httprequest.dark.svg' width='40' height='40' /></div><br/>AIRTABLE Create Index Refer.."]
n5["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/airtable.svg' width='40' height='40' /></div><br/>AIRTABLE Get Base Schema fro.."]
n6["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/httprequest.dark.svg' width='40' height='40' /></div><br/>AIRTABLE Create Webflow Form.."]
n7["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/code.svg' width='40' height='40' /></div><br/>Set New Webflow Form Table ID"]
n8["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/airtable.svg' width='40' height='40' /></div><br/>AIRTABLE Insert Record In Fo.."]
n9["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/airtable.svg' width='40' height='40' /></div><br/>AIRTABLE Insert Record In We.."]
n10["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/airtable.svg' width='40' height='40' /></div><br/>AIRTABLE Find Webflow Form R.."]
n11["<div style='background:#f5f5f5;padding:10px;border-radius:8px;display:inline-block;border:1px solid #e0e0e0'><img src='https://flowpast.com/wp-content/uploads/n8n-workflow-icons/code.svg' width='40' height='40' /></div><br/>Set Webflow Form Table ID"]
n12@{ icon: "mdi:swap-horizontal", form: "rounded", label: "Does This Webflow Form Table..", pos: "b", h: 48 }
n11 --> n12
n0 --> n1
n7 --> n8
n3 --> n10
n3 --> n4
n2 --> n3
n12 --> n9
n12 --> n6
n1 --> n5
n6 --> n7
n5 --> n2
n4 --> n6
n8 --> n9
n10 --> n11
end
%% Styling
classDef trigger fill:#e8f5e9,stroke:#388e3c,stroke-width:2px
classDef ai fill:#e3f2fd,stroke:#1976d2,stroke-width:2px
classDef aiModel fill:#e8eaf6,stroke:#3f51b5,stroke-width:2px
classDef decision fill:#fff8e1,stroke:#f9a825,stroke-width:2px
classDef database fill:#fce4ec,stroke:#c2185b,stroke-width:2px
classDef api fill:#fff3e0,stroke:#e65100,stroke-width:2px
classDef code fill:#f3e5f5,stroke:#7b1fa2,stroke-width:2px
classDef disabled stroke-dasharray: 5 5,opacity: 0.5
class n0 trigger
class n3,n12 decision
class n5,n8,n9,n10 database
class n4,n6 api
class n2,n7,n11 code
classDef customIcon fill:none,stroke:none
class n0,n2,n4,n5,n6,n7,n8,n9,n10,n11 customIcon
Why This Matters: Form Submissions Going to the Wrong Place
If you’ve ever had to untangle “which form did this person actually fill out?”, you already know the damage. One Webflow project can have lots of forms: contact, newsletter, download gates, event signups, partner inquiries. They often share field names, and sometimes they even share the same form name after a page is duplicated. In Airtable, that can mean records are mixed together, pipelines become unreliable, and your team stops trusting the data. Honestly, that’s when people go back to spreadsheets and inbox hunting.
It adds up fast. Here’s where it breaks down in real life.
- You lose time every week sorting and re-tagging leads because the original form source is unclear.
- Duplicate Webflow form names can route submissions into the wrong Airtable table, which means the wrong follow-up sequence gets triggered.
- Airtable “quick fixes” (like one giant table) become a dumping ground that’s hard to segment and report on.
- When one form breaks, you often find out late, after a client or teammate asks why leads went quiet.
What You’ll Build: Webflow Submissions Routed into the Correct Airtable Table
This workflow listens for new Webflow form submissions and formats the payload into a consistent structure before it touches your database. Then it checks your Airtable base to understand what tables already exist and looks for a dedicated “Form Index” table that maps each Webflow form to the right Airtable table ID. If the index table doesn’t exist yet, the workflow creates it, creates the form’s destination table, and stores the relationship so it won’t need to guess next time. Finally, it writes the submission into the correct Airtable table as a clean record. The end result is simple: each form gets its own organized destination, and you stop playing detective with lead sources.
The workflow starts the moment Webflow sends a submission webhook into n8n. Airtable is used both as the destination and as the “source of truth” for routing, using an index so duplicate form names don’t cause mix-ups. When a new form appears, it automatically creates what’s missing, then continues like normal.
What You’re Building
| What Gets Automated | What You’ll Achieve |
|---|---|
|
|
Expected Results
Say you run 6 Webflow forms across a marketing site and you check submissions twice a day. Manually, it’s maybe 10 minutes per form to confirm where it belongs, copy fields, and clean them up, so you burn about 2 hours a week just on routing and fixing mistakes. With this workflow, you spend a few minutes once to connect Webflow and Airtable, then submissions go to the right Airtable table automatically. New form? It creates the table and keeps going.
Before You Start
- n8n instance (try n8n Cloud free)
- Self-hosting option if you prefer (Hostinger works well)
- Webflow to receive form submission webhooks
- Airtable to store leads in the right tables
- Airtable Personal Access Token (get it from your Airtable account settings)
Skill level: Intermediate. You’ll connect credentials and be comfortable checking table names and field mappings in Airtable.
Want someone to build this for you? Talk to an automation expert (free 15-minute consultation).
Step by Step
A Webflow form submission triggers the workflow. Webflow sends the submission into n8n via the “Incoming Webflow Hook,” so every submission is captured immediately, not when someone remembers to check.
The submission is cleaned and reshaped. n8n reformats the payload (“Format Submission Payload”) so you’re working with consistent fields, even if different forms use slightly different labels.
Airtable is inspected and routing is decided. The workflow fetches your Airtable base schema, resolves the Form Index table, and checks whether a matching record exists for that Webflow form. If it finds one, it uses the stored table ID. If it doesn’t, it creates the index table (if missing), generates a new destination table for that form, then stores the new table ID in the index.
The lead is written to the correct table. Once the destination table is confirmed, the workflow creates the Airtable record with the submission details, so your CRM-like structure stays clean.
You can easily modify which fields get stored (and how they’re named) based on your needs. See the full implementation guide below for customization options.
Step-by-Step Implementation Guide
Step 1: Configure the Webflow Trigger
This workflow starts when a Webflow form submission is received and passes that data into the Airtable table builder flow.
- Add the Incoming Webflow Hook node as your trigger.
- Set Site to
[YOUR_ID]. - Credential Required: Connect your webflowApi credentials in Incoming Webflow Hook.
- Keep the Flowpast Branding sticky note for documentation (optional).
Step 2: Connect Airtable Base Schema
This step fetches the Airtable base schema so downstream nodes can find or create the proper tables.
- In Airtable Base Schema Fetch, set Resource to
baseand Operation togetSchema. - Set the Base value to
[YOUR_ID]. - Credential Required: Connect your airtableTokenApi credentials in Airtable Base Schema Fetch.
- Ensure Format Submission Payload is connected to Airtable Base Schema Fetch in the flow.
Step 3: Set Up Submission Payload & Index Resolution
This step standardizes the incoming Webflow payload and identifies the Airtable "Form Index" table if it exists.
- In Format Submission Payload, set Mode to
rawand Include tonone. - Set JSON Output to the exact expression:
={ "wf_id": "{{ $json._id }}", "wf_formId": "{{ $json.formId }}", "wf_formName": "{{ $json.name }}", "wf_requestDateTime": "{{ $json.d }}", "wf_data": {{ JSON.stringify(JSON.stringify($('Incoming Webflow Hook').item.json.data)) }} } - In Resolve Index Table ID, keep the provided JavaScript to set
at_baseId,at_formIndexTableId, andat_currentFormTableId. - In Check Index Table Presence, leave the condition as:
={{ $json.at_formIndexTableId }}contains=tbl.
Check Index Table Presence routes to Lookup Form Index Record if the index table exists; otherwise it routes to Create Index Reference Table.
Step 4: Configure Index Lookup and Conditional Table Creation
This step checks the Form Index table for an existing mapping and decides whether a new data table is needed.
- In Lookup Form Index Record, set Operation to
searchand Filter By Formula to={FormId}='{{ $json.wf_formId }}'. - Set the Base field to
={{ $('Resolve Index Table ID').item.json.at_baseId }}and Table to={{ $json.at_formIndexTableId }}. - Credential Required: Connect your airtableTokenApi credentials in Lookup Form Index Record.
- Keep the Assign Form Table ID JavaScript as-is to read
TableIdfrom the lookup result. - In Validate Form Table Exists, keep the condition that checks:
={{ $json.at_currentFormTableId }}exists.
Step 5: Configure Airtable Table Creation & Index Updates
When no form data table exists, the workflow creates the "Form Index" table (if missing), creates a new form data table, and stores references.
- In Create Index Reference Table, set URL to
=https://api.airtable.com/v0/meta/bases/{{ $('Check Index Table Presence').item.json.at_baseId }}/tablesand keep Method asPOST. - Set JSON Body to the provided schema definition for the
Form Indextable. - Credential Required: Connect your airtableTokenApi credentials in Create Index Reference Table (OAuth2 is optional if used).
- In Generate Form Data Table, set URL to
=https://api.airtable.com/v0/meta/bases/{{ $('Resolve Index Table ID').item.json.at_baseId }}/tablesand keep Method asPOST. - Set JSON Body to the provided schema definition and use the table name expression:
{{ $('Resolve Index Table ID').item.json.wf_formName }} - Credential Required: Connect your airtableTokenApi credentials in Generate Form Data Table (OAuth2 is optional if used).
- Keep Store New Table ID JavaScript unchanged so it stores
at_currentFormTableIdand optionallyat_formIndexTableId. - In Append Index Table Record, map fields using the expressions:
FormId→{{ $('Resolve Index Table ID').item.json.wf_formId }},TableId→{{ $json.at_currentFormTableId }},FormName→{{ $('Resolve Index Table ID').item.json.wf_formName }},TableName→{{ $('Resolve Index Table ID').item.json.wf_formName }} - Credential Required: Connect your airtableTokenApi credentials in Append Index Table Record.
Step 6: Configure the Form Submission Output
This step writes the final Webflow submission record into the appropriate form-specific Airtable table.
- In Add Form Submission Record, set Base to
={{ $('Resolve Index Table ID').item.json.at_baseId }}. - Set Table to
={{ $('Resolve Index Table ID').item.json.at_currentFormTableId }}. - Map the fields as follows:
Id→{{ $('Resolve Index Table ID').item.json.wf_id }}FormId→{{ $('Resolve Index Table ID').item.json.wf_formId }}FormName→{{ $('Resolve Index Table ID').item.json.wf_formName }}FormContent→{{ $('Resolve Index Table ID').item.json.wf_data }}FormCreationDate→{{ $('Resolve Index Table ID').item.json.wf_requestDateTime }} - Credential Required: Connect your airtableTokenApi credentials in Add Form Submission Record.
Step 7: Test and Activate Your Workflow
Validate the workflow end-to-end using a test submission before activating it for production.
- Click Execute Workflow and submit a test form in Webflow to trigger Incoming Webflow Hook.
- Confirm that Append Index Table Record adds a new row in the "Form Index" table when a new form is encountered.
- Verify that Add Form Submission Record creates a record in the correct form-specific Airtable table.
- Once successful, toggle the workflow to Active for production use.
Troubleshooting Tips
- Airtable credentials can expire or need specific permissions. If things break, check your Airtable Personal Access Token scopes (and the base access) first.
- If you’re using Wait nodes or external rendering, processing times vary. Bump up the wait duration if downstream nodes fail on empty responses.
- Default prompts in AI nodes are generic. Add your brand voice early or you’ll be editing outputs forever.
Quick Answers
About 30 minutes if your Webflow and Airtable access is ready.
No. You’ll connect Webflow and Airtable, then adjust a few field mappings in n8n.
Yes. n8n has a free self-hosted option and a free trial on n8n Cloud. Cloud plans start at $20/month for higher volume. You’ll also need to factor in Airtable costs (often free to start, then paid as you scale records and collaborators).
Two options: n8n Cloud (managed, easiest setup) or self-hosting on a VPS. For self-hosting, Hostinger VPS is affordable and handles n8n well. Self-hosting gives you unlimited executions but requires basic server management.
Yes, and you probably should. Most teams tweak the “Format Submission Payload” step to match their Airtable fields, then customize how the Form Index record is stored so it includes extra metadata like page URL, campaign, or owner. You can also change the “Generate Form Data Table” creation logic if you want all forms to share one table with a “Form Type” field instead of separate tables. The workflow is designed for routing safety first, not one rigid database style.
Usually it’s an Airtable token scope issue or the token no longer has access to the base you’re writing to. Regenerate the Personal Access Token, confirm it includes the right base, and update the credential in n8n. If it fails only when creating tables, check that your Airtable plan and permissions allow schema changes.
For most small sites, it will handle normal lead volume without any tuning.
Often, yes, because this workflow does more than “send form to Airtable.” It inspects your Airtable schema, keeps an index of form-to-table mappings, and can create missing tables automatically, which is the kind of conditional logic that gets awkward (or expensive) in simpler tools. n8n also gives you a self-hosted option, which matters once you’re processing lots of submissions or running many automations. That said, if you truly have one form and one table forever, Zapier or Make can be quicker to set up. Talk to an automation expert if you want help choosing.
Once this is running, your Webflow submissions stop being “data you clean later” and start being leads you can act on immediately. Set it up, trust the routing, and move on.
Need Help Setting This Up?
Our automation experts can build and customize this workflow for your specific needs. Free 15-minute consultation—no commitment required.