Send records to Attio when a new Webflow form is submitted

Webflow is a popular website building platform with drag-and-drop form functionality. Here's how to automatically send new Webflow form submissions to your Attio collection using Zapier.

Prep: Connect Webflow to Zapier

You’ll first need to connect your Webflow account to Zapier - follow this short guide to get started.

Prep: Connect Attio to Zapier

Follow our short guide on connecting Attio and Zapier, making sure you've set up your API key with both read and write permissions.

1. Create your form in Webflow

Forms in Webflow are customizable elements or ‘blocks’ you can add to pages in order to collect data from visitors to your site. Learn more about designing and publishing forms in Webflow.

If you’re using a brand new form for this Zap, you’ll need to complete at least one submission - you can do this yourself using mock data. You can also use a pre-existing form to build this Zap, as long as it's previously received a submission.

Create your custom form in Webflow - forms exist as 'blocks' you can add to pages

If your form collects first and surnames as one field (e.g. ‘Full name’) you’ll need two extra steps in your Zap to split them. Follow our short guide to splitting names in Zapier.

2. Build your trigger in Zapier

From your Zapier dashboard, click Create Zap in the top left. Search for Webflow from the App Event window, and from the Trigger Event dropdown pick Form Submission. Choose your Webflow account when prompted. Next, choose your Site Name and Form Name from the two dropdowns. Continue to test your trigger.

3. Find or create a person in Attio

Next, we’ll tell Zapier to send new form submissions to your Attio workspace. Add a new action step with the + icon and pick Attio from the App Event dropdown. For Action Event, choose Find or Create a Person. Select your Attio account. Mapping the fields using the data from step 2, set your action up like this:

Locate an existing person or create a new one in your Attio workspace

To link a person and a company in Attio you’ll first need to add a Find or Create Company action, followed by a Link Person and Company action. Map the fields using data from prior steps. Learn more about mapping fields.

4. Create a new entry in your collection

Add another action step to your Zap and pick Attio from the dropdown. Choose Find or Create Entry from the Action Event dropdown, and select your Attio account when prompted.

For the Record ID field, you’ll need to map data from the Find or Create a Person step in your Zap. Choose Find or Create Person from the Record ID dropdown, followed by Show all options. Scroll down to find ID. Your action should look like this:

Create a new entry in your Attio collection using values from previous steps

That’s it! Now every time a new response is submitted using your Webflow form, Zapier will add an entry to your Attio collection. Check out more ways to connect Attio to the apps you love.