Skip to main content

Connect Klaviyo with Framer Forms

Capture leads from your Framer forms and automatically add them to your Klaviyo profiles using the Forms Plugin. Setup takes seven steps. Steps 1 to 4 connect the form. Steps 5 and 6 are only needed if you want visitors to be subscribed to your marketing email. Step 7 checks that everything works.

Step 1 - Get Your Klaviyo API Key

Before connecting Klaviyo to your form, generate an API key from your Klaviyo account. This API key allows the Forms Plugin to securely send form submissions to Klaviyo.
Klaviyo account showing the API Keys settings page
  1. Login to your Klaviyo account
  2. Navigate to Settings → API Keys
  3. Click Create Private API Key
  4. Grant it the profiles:write and lists:write scopes. Add subscriptions:write too if you plan to use Subscribe (Step 5)
  5. Copy the generated API key
Keep your API key in a secure password manager. Never share it publicly or commit it to a code repository.

Step 2 - Insert Klaviyo Component Into Your Form

Select your form in the Framer canvas and insert the Klaviyo component. The component connects your form to Klaviyo. You tell it which form fields to send in Step 4.
Forms Plugin panel in Framer showing the Klaviyo Integrations screen with the Insert Klaviyo Component button

Step 3 - Configure Klaviyo API Settings

After inserting the Klaviyo component, configure the API settings in the component properties panel.
Framer canvas with Klaviyo component selected showing the API Settings modal
  1. Select the Klaviyo Integration component in your form
  2. Open the properties panel on the right side
  3. Paste your Klaviyo API Key
  4. (Optional) Enter a List ID to add submitted profiles to a specific Klaviyo list
  5. Choose whether to Update Existing profiles if the email already exists in your Klaviyo account
Subscribe and Consent Field are in the same panel. Leave them for now; they are covered in Steps 5 and 6.

Required Fields

  • API Key - Paste the Klaviyo Private API key (starts with pk_...) generated from your Klaviyo account.

Optional Fields

  • List ID - Enter a Klaviyo List ID (6 chars, e.g. XaB1Cd) to add submitted profiles to that list. Leave this empty to create profiles without adding them to a list.
  • Update Existing - When set to Yes, existing profiles will be updated if the submitted email already exists in Klaviyo. Set to No to skip updates and only create new profiles.
  • Subscribe - Defaults to No. See Step 5.
  • Consent Field - Optional, and only used when Subscribe is Yes. The Name of a consent checkbox on your form. When set, a profile is subscribed only if the visitor ticked that box. Leave it empty and every submission counts as consent. See Step 6.

Find your List ID

In Klaviyo, go to Audience → Lists & segments and open the list you want to use. Click the Settings tab, then Details. Copy the value under List ID with the copy button next to it.
Klaviyo list Settings tab, Details section, showing the List name and the List ID with a copy button

Step 4 - Configure Field Mapping

Map your form fields to Klaviyo profile properties. Add one mapping row per field you want to send. Enter the name attribute of your form field on the left and the Klaviyo property it should populate on the right. Mappings are entered manually - the component does not read your form’s fields for you. At least one mapping must target email.
Framer canvas showing the Mappings modal with form fields mapped to Klaviyo properties

Example Mapping

Other common Klaviyo properties are phone_number, organization and title. Form field names are matched without regard to upper or lower case.
You do not need to map the consent checkbox from Step 6. It is read through Consent Field, not through a mapping.

Step 5 - Choose Subscription and Double Opt-in

Klaviyo tracks two separate things for every person: whether they are in a list, and their consent status. Adding someone to a list does not give consent, which is why a profile can appear in a list while still showing a Never subscribed warning. The Subscribe setting in the Klaviyo component’s API Settings decides whether consent is recorded: If you only want to collect contacts, keep Subscribe on No and skip to Step 7.
Only turn Subscribe on when the form genuinely asks for marketing consent. Enabling it on a contact or support form subscribes people who never asked for email, which is not permitted under GDPR. For forms that serve both purposes, add a consent checkbox as shown in Step 6.
Using Subscribe requires the subscriptions:write scope on your API key. If the key is missing it, submissions fail with a message telling you to regenerate the key in Klaviyo.

Turn on double opt-in

With double opt-in, a new subscriber first gets a confirmation email from Klaviyo and only becomes Subscribed after clicking the link in it. Until then the profile shows as Pending. This proves the email address is real and that its owner asked to join. Double opt-in is not configured in Framer. It is a setting on the Klaviyo list itself, and the Forms Plugin follows it automatically.
  1. In Klaviyo, go to Audience → Lists & segments and open your list
  2. Click the Settings tab, then Consent
  3. Under Opt-in process, choose Double opt-in (or Single opt-in to subscribe people straight away, with no confirmation email)
Klaviyo list Settings tab, Consent section, showing the Opt-in process choice between Double opt-in and Single opt-in
  1. (Optional) Open the Consent pages tab of the same list to change the confirmation email and the pages people see when they subscribe. Click Customize for this List to give this list its own version, or keep the account defaults.
Klaviyo list Consent pages tab with the Go to default pages and Customize for this List buttons
Double opt-in only applies when Subscribe is Yes on the Klaviyo component. With Subscribe off, nobody is subscribed, so no confirmation email is ever sent.
Use this when the form is not only a newsletter sign-up. Example: you have a contact form and want to grow your newsletter from it, but only with people who actually ask for it. A consent checkbox lets each visitor decide.

1. Add a checkbox to your form

Open Forms Plugin, go to Fields → Basic and click Checkbox to add it to your form. Then select the checkbox on the canvas and, in its properties panel:
  • Set its Name to checkbox. This is the value you will enter in Consent Field.
  • Give it clear label text, for example Yes, send me news and offers by email
  • Leave it not required, so the visitor can still send the form without subscribing
  • Leave it unticked by default
Framer form with an unticked consent checkbox labelled Yes, send me news and offers by email, placed above the Klaviyo component and the Submit button

2. Connect the checkbox to the Klaviyo component

Select the Klaviyo Integration component and, under API Settings, set:
  • Subscribe - Yes
  • Consent Field - checkbox (the same Name you gave the checkbox)
Framer canvas with the Klaviyo Integration component selected and the API Settings panel open, showing Subscribe set to YesKlaviyo API Settings panel with Subscribe set to Yes and Consent Field set to checkbox

3. What happens when the form is sent

Every visitor still reaches you through the form. Only the ones who ticked the box join your marketing audience.
Do not make the consent checkbox Required and do not tick it by default. Consent must be a free choice by the visitor, and Klaviyo does not accept consent that was pre-selected or forced.
The Consent Field value must match the checkbox Name, not its label. If the names do not match, the box is never found and nobody is subscribed.

Step 7 - Test and Check the Result

When the Klaviyo component is set up, it shows Integration active on the canvas.
Completed Klaviyo integration on a form with Integration active status
Publish your site and send a test submission. The details are added as a profile in Klaviyo. You can verify new profiles in your Klaviyo Profiles dashboard. To check consent, open the profile in Klaviyo (or open your list first if you set a List ID). The status is shown under Channel consent → Email:
  • Never subscribed - Subscribe is off, or the visitor left the consent checkbox unticked
  • Pending - the list uses double opt-in and the visitor has not clicked the confirmation link yet
  • Subscribed - consent is recorded and the profile can receive campaigns
A visitor who was not subscribed shows Never subscribed:
Klaviyo profile with the Channel consent card showing Email as Never subscribed
A subscribed visitor shows Subscribed, with the Subscribed to list and Subscribed to Email Marketing events in the activity feed:
Klaviyo profile with the Channel consent card showing Email as Subscribed and Subscribed to list events in the activity feed
If you use a consent checkbox, send two test submissions, one ticked and one unticked, and check that each profile shows the expected status.

Next Steps