If you are interested in adding a new sign up form to your Shopify store, Klaviyo provides an easy way to build three different types of forms:
- Embedded forms
- Pop-up/modal forms
- Fly out forms
This article will explain how to get these forms up and running on your site by adding Klaviyo form code to your Shopify store's theme.
To first explore how to create and customize these forms in Klaviyo, check out this guide.
Add Klaviyo Form Code to Your Site
Once you've finished customizing your pop up or fly out in Klaviyo, it's time to add it to your Shopify store. To do this, open your Shopify store's backend in a new tab and navigate to Sales Channels > Online Store > Themes.
Once inside of Themes, click the small ellipsis in the upper right-hand corner and then click Edit HTML/CSS.
From there, paste your code into the theme.liquid template right after the opening
Once the code has been pasted into your template, visit your store's URL to make sure everything looks right. This is what our basic pop up looks like:
And this is what our basic fly out looks like:
Will my pop up or fly out form show up every time some visits my site, even if he/she has already subscribed?
By default, when a user closes a fly out or popup, this person will not see the form again for a period of time. This is customizable, however.
If someone visits my site and closes one pop up, will it stop my other forms from appearing as this person continues to browse?
If a user closes a fly out or popup, all other fly outs and pop ups on your site will remain closed as the user continues to navigate the site. This is also adjustable.
How can I further customize my pop up/fly out form?