Adding Klaviyo Sign Up Embed Link to Homepage Footer

Store Design
,
1

Hi Shopify Design Community,

I’m trying to replace my Shopify newsletter in my footer and embed it with a Klaviyo sign-up form, but I’m having trouble placing it in the same position. (It’s appearing below the footer page navigation when I add it and the multi-currency selection is also getting mixed up).

This is what I’m trying to replicate -

hpeltz_0-1684171103866.png
hpeltz_0-1684171103866.png2368×442 26.7 KB

Can anyone help me and tell me where exactly to add the code?

Much appreciated, Hilary

1 Like
2

  1. Locate the footer section: Look for the code related to your footer section. It is typically located in the footer.liquid or theme.liquid file, depending on your theme. Search for the HTML code that corresponds to the existing Shopify newsletter sign-up form.

  2. Remove the Shopify newsletter form code: Remove the HTML code for the Shopify newsletter form. It may look similar to <form action="/contact#contact_form" method="post">.

  3. Paste the Klaviyo sign-up form code: Paste the Klaviyo sign-up form code in the same location where the Shopify newsletter form code was previously located. Make sure the code is placed within the appropriate HTML structure for your footer section.

  4. Adjust the positioning: If the Klaviyo form is appearing below the footer page navigation or causing layout issues, you may need to adjust the CSS styles for the form. Use CSS to control the positioning, margins, and padding of the form elements to ensure it aligns properly within your footer.