Klaviyo-Webflow Integration Script

A lightweight, professional script for connecting Webflow forms to Klaviyo

v1.3.0

15.2 KB

Quick Links

Installation Instructions

1. Add the script to your Webflow site

Copy the script tag below and paste it into your Webflow site's custom code section (under Site Settings > Custom Code > Footer Code).

<script src="https://www.webflow-integrate-klaviyo.com/api/script"></script>

Versioning Options

For production use, you can pin to a specific version to prevent unexpected changes:

<script src="https://www.webflow-integrate-klaviyo.com/api/script/v1.3.0"></script>

2. Initialize with your Klaviyo information

Add this initialization script with your Klaviyo public API key and list ID.

<script>
  document.addEventListener('DOMContentLoaded', function() {
    KlaviyoWebflow.init({
      publicApiKey: 'YOUR_KLAVIYO_PUBLIC_API_KEY',
      defaultListId: 'YOUR_KLAVIYO_LIST_ID',
      debug: false
    });
  });
</script>

3. Add attributes to your Webflow forms

Add the data-klaviyo-form attribute to any form you want to connect to Klaviyo.

<!-- In the Webflow Designer, add these custom attributes to your form -->
<form data-klaviyo-form data-klaviyo-list-id="YOUR_LIST_ID">
  <!-- Your form fields will be automatically mapped to Klaviyo fields -->
</form>

Script Details

Version History

Version 1.3.0
Released: November 15, 2023
- Version 1.3.0 released

Technical Details

File Size:15.2 KB
Load Strategy:Asynchronous
Dependencies:None (self-contained)
Browser Support:All modern browsers
Klaviyo API Version:2025-04-15
CDN Caching:Yes, 1 year with version pinning

For detailed instructions and advanced usage, refer to our complete documentation.

View Documentation