Solved

How to add a pop-up link to a button on shopify?

  • 29 May 2022
  • 2 replies
  • 108 views

Badge +1

Hi, I am driving myself nuts trying to figure this out…

I have built a landing page to my existing shopify store for  my new business to collect emails. 

In the landing page I have a button that requires a webpage for a link.

I thought I would be able to create a pop-up and add the link but Klaviyo only gives a code.

I have no idea where this code should go in my back end of shopify.

 

I have followed the Klaviyo instructions to add a button but it doesn't work. It shows as a tin basic button and doesn't link to the pop up.

is there anyway to place the pop link where the webpage is required?

Or is there a simpler way of doing this? it seems really over complicated? 

icon

Best answer by Dov 31 May 2022, 15:26

View original

2 replies

Userlevel 7
Badge +53

Hi @loubiblu,

Thanks for sharing this question with our community.

To simplify this process, I’d try inserting the URL we provide for a given Klaviyo list in the Shopify button calling for a webpage. This link (2nd screenshot below) will lead the user to the Klaviyo subscribe page for that list. You can also add fields to that subscribe page to collect additional information about your subscribers - you can read more on that here.  

You can find the URL for your lists’s subscribe page by navigating to the list > subscribe & preference pages > subscribe (button)

You’ll see a button that says, "Copy URL". this is the URL for the subscribe page for that list.

embedSubscribePage.png

Alternatively, you can also consider embedding the Klaviyo subscribe page as a discrete form on your site.

To embed this page on your website, simply copy the following snippet of code to your site and replace SUBSCRIBE_URL with the URL for your page.

<iframe id="klaviyo_subscribe_page" src="SUBSCRIBE_URL&embed=1" seamless="seamless" width="100%" scrolling="no" ></iframe> 
<script type="text/javascript" src="//a.klaviyo.com/media/js/lib/iframeresizer.js"></script>
<script type="text/javascript">iFrameResize({}, '#klaviyo_subscribe_page');</script>

Lastly, you can consider adding a simple pop-up to the page on your Shopify store. You can control what page the Klaviyo pop-up populates through the behavior settings of the form. Here’s a community post outlining how to achieve that:

I hope that information is helpful. 

 

Badge +1

Hi, thanks for replying, 

Finally! Thank you for showing me how!  This works fine with the link.

 

 

Reply