How to Create a Klaviyo Popup

read
Last updated at:

Overview 

Learn how to create a popup and convert your site visitors into email or SMS subscribers. Popups are one type of signup form you can create in Klaviyo, in addition to flyouts and embedded forms. 

Popups are the highest-converting type of signup form, as they appear on top of your site’s content and temporarily prevent visitors from interacting with other elements of your site. Two common popup use cases are: 

  • Welcome popup
    A welcome popup incentivizes your site visitors to join your email or SMS list, typically appearing a few seconds after someone lands on your site
  • Exit intent popup
    An exit intent popup appears when a visitor is about to navigate away from your site, and encourages them to subscribe to your marketing before they go

Before You Begin 

Before building your popup in Klaviyo, make sure you’ve enabled Klaviyo’s onsite JavaScript. For most ecommerce platforms, this is as easy as checking a box in your integration settings. Learn how to enable Klaviyo’s onsite JavaScript

Create a Basic Popup 

There’s no limit to how many popups you can create in Klaviyo. 

  1. To get started, click Signup Forms from the left menu
  2. If this is not your first signup form, click Create Signup Form
  3. From the All Types dropdown, select Popup
  4. Scroll through the form library and select a template, or click Build From Scratch

A user creates a Klaviyo popup from the form template library

Once you’ve selected a template, an editable version will open in the signup form builder. Here, you can adjust the form’s styles, targeting, and content. Make sure to customize all steps of the form, including the Success Message. Skip ahead to see examples of customized forms. 

Customize Your Popup 

You can customize your popup form’s styles, targeting, and content. Below, you’ll find examples of recommended settings for some common popup forms. 

Welcome Popup with Discount

To create a welcome popup with a discount: 

  1. Open the Targeting & Behavior settings of your form. 
  2. In the Display Timing section: 
    • Set a loading delay of a few seconds (i.e., 2-5), and
    • Don’t select any other loading delay options. 
      A form's behaviors settings with a two-second time delay
  3. In the Targeting section, select Target visitors in a list or segment > Don’t show to visitors in certain lists and segments, then select your main list. 
    A form's targeting settings set the form to appear to visitors who are not in the Newsletter list
  4. Customize the appearance of the form to match your brand and add input blocks to request any additional information you’d like to collect.
    Recommended: Ask for new subscribers’ first names by adding a text input field and choosing “First Name” as the profile property.
    In a text input block's settings, the first name field is mapped to the Klaviyo First Name field
  5. Include an incentive to encourage visitors to subscribe, such as a 10% discount on their first purchase. 
  6. Click Success and adjust the success message to match your form’s styles and incentive. Optionally, click Step to add additional steps to your form
  7. Once your form is ready to go, click Publish. It will appear on your site right away for visitors who meet the criteria you’ve set. 
  8. Create a welcome flow to deliver the incentive offered to new subscribers.

Here’s an example of a live welcome popup: 

A sample welcome popup in the Klaviyo form editor

Exit Intent Popup

To create an exit intent popup and convert visitors who are about to leave your site: 

  1. Open the Targeting & Behavior settings of your form. 
  2. In the Display Timing section, click Loading delay > Show when visitor is exiting the page, and don’t select any other loading delay options. 
    A form's behavior settings are set to display the form when a visitor shows exit intent
  3. In the Targeting section, select Target visitors in a list or segment > Don’t show to visitors in certain lists and segments, then select your main list. 
    A form is set to show only to visitors who are not in the Newsletter list
  4. Customize the appearance of the form to match your brand and add input blocks to request any additional information you’d like to collect. 

    Recommended: Ask for new subscribers’ first names by adding a text input field and choosing “First Name” as the profile property. 

  5. Consider offering a different incentive than your welcome popup (e.g., free shipping or 15% off), as exiting visitors may have already seen and ignored that form. 
  6. Click Success and adjust the success message to match your form’s styles and incentive.
  7. Once your form is ready to go, click Publish. It will appear on your site right away for visitors who meet the criteria you’ve set. 
  8. Customize your welcome flow to deliver the right offer to each subscriber, if the offer is different from that of your welcome popup.

Here’s an example of a live exit intent popup: 

An example of an exit intent form in the Klaviyo editor

Additional Resources

x
Was this article helpful?
38 out of 57 found this helpful