How to add a Klaviyo embed form to your Square Online site
You will learn
Learn how to add a Klaviyo embed form to your Square Online site, which requires creating a form in Klaviyo, and then pasting its embed code into your site’s files where you want it to appear (e.g., the footer).
Before you begin
Before creating an embed form in Klaviyo, make sure you've integrated Klaviyo with Square and set up onsite tracking to enable sign-up form functionality. If you checked the setting Automatically add Klaviyo onsite JavaScript when integrating with Square, you’re all set.
If not:
- In Klaviyo, select the Integrations tab.
- Click on Square.
- Check the setting Automatically add Klaviyo onsite javascript.
- Click Save.
Add the form's embed code to your site
First, create and publish your embed form in Klaviyo. This section will go over the next steps of pasting your form's embed code on your Square Online site so it displays and syncs data properly.
- Navigate to your Square Online dashboard.
- Click Website > Edit Site.
- Open to the page where you’d like to embed the form.
- Select Add Section > Embed code, then click Add.
- Copy the following script and paste it into the Code box:
<script type="text/javascript" src="https://static.klaviyo.com/onsite/js/PUBLIC_API_KEY/klaviyo.js"></script> - In the code you just pasted, replace PUBLIC_API_KEY with your Klaviyo public API key.
- To find your public API key, navigate to Settings > API keys in Klaviyo. This is a 6-character code, also referred to as your "account ID."
- Navigate back to Klaviyo and copy your form's embed code from the Targeting & behaviors tab within the form editor.
- In Square, paste the embed code in the Code box beneath where you pasted the other script in step 5.
- Select Done.
- Select Publish to save your changes.
Once you've pasted the embed code and saved your changes in Square, nagivate back to your website and refresh the page. Your embed form will display on your site and add new subscribers directly to the Klaviyo list linked to the form.
If you don't see your form, see troubleshooting embed forms.
If you decide to disconnect your Square integration, you will need to manually remove this embed code from the Square Online site editor to remove your form.
Next steps
Next, create a welcome series to make an immediate impact on your new subscribers.
Additional resources
- Getting started with Square
Learn how to easily integrate Klaviyo with your Square Online site in order to sync customer profile, order, and catalog information to Klaviyo, along with order data from your Square Point of Sale (POS). With this data, you’ll be able to reach customers with targeted messaging through segmentation, automated flows, and campaigns.
- How to embed a sign-up form on your website
Learn how to add an embed sign-up form onto a specific page or location of your website (e.g., the footer), so shoppers looking to learn more about your brand can easily sign up. Embedding a sign-up form in the footer of your site to work in tandem with your other published forms is a Klaviyo best practice for optimizing list growth.
- How to verify that sign-up forms are enabled
Learn how to verify that sign-up form functionality is enabled on your website. This makes sure that sign-up forms published in Klaviyo display as expected on your site and sync all necessary data to Klaviyo.