Step-by-step tutorial
Quick walk-through to connect Airtable and Webflow
- Create a table/field in Airtable for every table/field in Webflow you want to sync.
Example of matching fields in Webflow / Airtable
Note - you do not have to sync every table/field.
- Ensure that any collection you want to sync with Airtable is empty in Webflow.
- Publish your site to all domains.
3. Go to Whalesync and create a new base
- From the dashboard, select “Create New”.
4. Grab your Airtable API key
- Go to your Airtable base and click the account button in the top right.
- Choose “Account”.
- From the "Account overview" page, copy the API key and paste it into Whalesync.
5. Grab your Airtable base sharing link
- Go back to your Airtable base and click the “Share” button in the top right.
- Click “Share publicly”.
- Then toggle "Enable shared base link (read-only)".
- Finally, click the base sharing link to copy it.
- Paste it into Whalesync.
6. Map Airtable tables to Webflow collections
- Using the dropdowns, map the tables in Airtable and collections in Webflow you want to sync.
If the names of the tables match exactly across Airtable and Webflow, Whalesync will auto-map them for you.
7. Map Airtable fields to Webflow fields
- Similar to the last step, choose the individual fields you want to sync across Airtable and Webflow.
8. Turn sync on
- From the Whalesync dashboard, toggle sync on.
.png?alt=media&token=b59b299b-9dde-47c2-bc2e-7387288b193a)
- Instantly see data start syncing in real-time.
9. Check the Issues page for any errors
- After setting up a sync, check https://app.whalesync.com/issues to see if any records could not be synced.
- Once you resolve an error, it will disappear from the issues page.
Conclusion
Whalesync is the easiest way to connect Airtable and Webflow. You can set up a real-time, two-way sync between your favorite tools in a few minutes. Let us know if you have any questions at [email protected] or get started here.
Last modified 4mo ago