Webflow to Klaviyo Form Integration
A simple script that connects your Webflow forms to Klaviyo lists. Created for the Webflow community.
Professional Installation Available
Get it set up correctly in a 30-minute live session with Javin
"email": "user@example.com",
"first_name": "Jane"
}
"email": "user@example.com",
"first_name": "Jane"
}
How It Works
Connect your Webflow forms to Klaviyo in three steps
Add the script
Copy the integration script to your Webflow site's custom code settings.
Get the scriptConfigure Klaviyo details
Add your Klaviyo API key and list ID to establish the connection.
Tag your forms
Add data attributes to any form you want to connect to Klaviyo.
Integration Features
Everything you need for a seamless Webflow to Klaviyo connection
Quick Setup
A script tag and a few form attributes are all you need to get started.
- No custom code needed
- Works with Webflow forms
Field Mapping
Maps form fields to Klaviyo properties with support for custom fields.
- Standard field mapping
- Custom field support
Multi-List Support
Connect different forms to different Klaviyo lists as needed.
- Multiple list targeting
- Per-form configuration
Consent Tracking
Built-in consent tracking options for compliance purposes.
- Consent checkboxes
- GDPR considerations
Custom Events
Track form submissions as custom events in Klaviyo.
- Form submission tracking
- Custom event properties
Form Validation
Basic validation for email formats and required fields.
- Email format checks
- Required field validation
Interactive Playground
Experiment with different form configurations and see exactly how your data flows into Klaviyo.
- Test forms instantly
Try different field configurations and see immediate results
- Validation previews
See how email validation and required fields work in real-time
- API payload inspection
View the exact data structure sent to Klaviyo for each submission
Klaviyo Integration Playground
API Request Preview
"email": "example@email.com",
"firstName": "John",
"listId": "xyzABC123",
"consent": true
}
Frequently Asked Questions
Common questions about the Webflow to Klaviyo integration
QDo I need to know how to code?
No coding is required. The integration uses data attributes on standard Webflow forms.
QWill this affect page performance?
The script is lightweight and loads asynchronously to minimize any impact on page loading.
QWhich Webflow forms are supported?
All native Webflow forms are supported, including Form Blocks and custom Form elements.
QIs this GDPR compliant?
The integration includes consent tracking options that can be configured to help with GDPR requirements.
QCan I use multiple Klaviyo lists?
Yes, different forms can connect to different Klaviyo lists based on the data attributes you set.
QHow can I get help with installation?
This script is free and open-source with documentation to guide you.
Free and Open Source
This project is available for free use by the Webflow community. The code is open source and available for contributions.
Expert Installation
Get it done right in 30 minutes with live professional help.
- Live 1-on-1 setup call
- Setup completed in ~30 minutes
- Custom field mapping assistance
Created by Javin Towers
About the Creator
Javin Towers
Javin is a full-stack developer and entrepreneur with expertise in building seamless integrations between marketing platforms. He founded StackPack, a development agency that specializes in Webflow and third-party integrations.
10+ years experience building web applications and marketing automation tools
Created open-source solutions used by hundreds of Webflow developers
Expert in JavaScript, React, Next.js, and API integrations
Ready to Get Started?
Connect your Webflow forms to Klaviyo with this free integration tool or get professional installation help.
Professional installation includes a 30-minute live session to get everything set up correctly.