My form appears but cannot get it to center on my Shopify page. What I am doing wrong? It is left justified. 

Hello @jjaworsky,

I would first recommend ensuring that your signup form is published to the latest version within Klaviyo. Any changes you make within the signup form builder in Klaviyo will not be published onto your page until you’ve gone through and published it. 

If your form looks to be rendering correctly as you designed within the Klaviyo signup form builder and published to the latest version and still appears to be mis-rendered, I would recommend double checking if you happen to have any onsite CSS that may be impacting how your form appears. I elaborated further on this in another Community Post which you can find below:

I hope this helps!

David

I added the embedded form to a “page” like stated above, and when i went to my store it was simply a link.  when i clicked on it i saw the box i created on klaviyo in a new page.  how do i make it so its just on the footer of the main page?  

Hey @StephCosta,

I would suggest taking a look at the Shopify subsection in the Where to Paste a Form's Embed Code Help Center Article to guide you on how to embed a signup form onto your website. From the experience you are detailing, it sounds like you may have either create a new page on your website where this embedded form is housed or you may have added this embed form within some other lines of code within your website which may be causing it to redirect to another page. 

David

oh my goodness i got it to work!  thank you!  The only thing is, I deleted the old newsletter sign up code and replaced it with my code for the klaviyo sign up.  I assumed that meant it would go in the same spot.  but its all funky and not in line with the other things in that row.  Any idea how to figure out how to fix that?  the spacing of it?  I included a pic so you can se what i mean.  The arrow pointing where I wanted it to go!

Hey @StephCosta,

Glad you got it working!

I would suggest reviewing the codes surrounding the area where you intend the Klaviyo embedded form to appear and making some appropriate adjustments in the code to align it properly if needed. 

Since this does pertain to working on your site’s code, I would suggest working with a site developer or finding a Klaviyo partner who can better assist with this. 

Thanks for being a Klaviyo Community Member!

David

Will do, thank you!

Hi, I have followed all the instructions and pasted the code into the source (< >) for a page in Shopify but when I preview the page where the form is supposed to be its just blank. It’s all saved in Shopify and live in Klaviyo, just not showing up at all. Any advice appreciated. I have just moved over from Active Campaign and have used their forms before in the same way.

Hello @LanaHooper,

Since it sounds like you are trying to add an embedded Klaviyo form to a specific page on your Shopify site that is not meant for the footer; can you confirm if instead of adding the embedded form’s <div> code directly to the page source code, you’re adding a Custom content or a Custom HTML block to the page first. Following adding these sections to your page, you’ll want to add the embedded form’s <div> code to these sections. You can also find a GIF of how to perform this action from the Where to Paste a Form's Embed Code article which i’ve included below for your convenience:

David

I am doing these exact steps and I am not new to building websites or coding but I can not seem to get it to show up?

I am trying to have it show on this page…

https://getthegifts.com/pages/rick-and-morty-giveaway

Can anyone help? Thanks in advance!

@GetTheGiftShop - I looked at your page and I think one possible reason is you have multiple Klaviyo accounts associated with your Shopify. 

You might want to contact Klaviyo to see why there are two different Klaviyo accounts associated with your site. 

Aside from making sure you pasting the snippet code as source, and making sure the form is Published Live, that might be an issue too.

Thanks @retention for the great callout and explanation as to what is going on! I just edited your post to omit the klaviyo.js account IDs for @GetTheGiftShop for safety and security purposes.

We had a great writeup by @David To regarding this type of issue and how to check for it:

Typically this sort of console error arises when you have either duplicate Klaviyo.js present on your site all linked to the same account or if you happen to have multiple Klaviyo accounts accidentally integrated to the site. You can check to see if there this error is caused by a duplication in the Klaviyo javascript or by having multiple Klaviyo accounts by reviewing the Klaviyo.js snippets on your site through:

1. Going to your website
2. Viewing the Page Source or viewing the Inspector Tool
3. Control + F (or Command + F on Mac)
4. Search for the phrase Company_ID

If you were able to locate multiple instances of the same Klaviyo.js present on your site referencing the same Klaviyo Account ID, this may indicate that you have both the setting of Automatically add Klaviyo onsite javascript (recommended) enabled in your Shopify integration settings and have manually installed the Klaviyo.js snippet. In this case, we would recommend only one or the other; either allow Klaviyo to automatically inject the javascript or manually installing the javascript. To resolve this, I would suggest manually finding and removing this snippet from your theme file while only allow Klaviyo to automatically inject the Klaviyo javascript from the Shopify integration settings. (source)

I would recommend checking that community post out for those running into similar errors!

Alex

@alex.hong @retention Yes but how do I completely remove it if I can not log into the old Klavyio accounts? because I have no idea what the login info for those even is. 

I have found that I have 2 within my code when viewing the website source, but then when I go to edit code on my Shopify store > Theme.Liquid ...I no longer can find any Klavyio code in there?

Where do I go to remove this?

Hi @GetTheGiftShop,

If you are having trouble with getting into an account, I would recommend contacting Support as they are best suited to assist with problems like this. Their team should also be able to remove the duplicate klaviyo.js from your site as well.

This won’t be editable on the theme.liquid. Instead you would have to make some API calls to delete the incorrect account and disconnect it from your site. Again, the support team will be your best bet for this situation.

Thanks!
Alex

Hello 

I am also trying to embed a sign up form onto a page just for that.  Basically making my own landing page on my website.   I cannot get it to display.

I went to Themes --- Customize -- and since I want it on a specific page I went to the article at https://help.klaviyo.com/hc/en-us/articles/360006897412#shopify4

And tried to follow the steps 

1. Navigate to your Shopify admin
2. Go to Online Store > Themes
3. Click Customize > Add Section            THERE IS NO ADD SECTION when you are in pages!!!!! only on homepage can you add a section. SO what do I do?  

I want to know how to do this because I want to create several sign up forms in the future 

What am I missing?  

This is the page I am trying to put it on

https://olivegrovelife.com/pages/you-are-loved-bible-newsletter

Thank you so much! 

Hi there @Oliveblessed5,

Thanks for posting here and let me see if I am understanding correctly. In order to create a full-page subscribe Form, click on the appropriate List and navigate to the Subscribe & Preference Pages tab from the header navigation menu. Here, you can customize the styling of your subscribe page and add custom fields.After you have designed your subscribe page, simply copy the snippet of code and paste it to your site. I recommend reviewing our guide on Embed a Full Subscribe Page on Your Website for additional details and instructions on how to set this up.

Now if you are attempting to have a full subscribe page placing the code can be a bit tricky, knowing that it's an iframe it can technically go anywhere, but I'd recommend creating a new page in Shopify and adding the code into the source code of the page content. So you would create a new page and edit the HTML with the code:

​

Another alternative I would also recommend would be ​using a link to direct a customer to your Subscribe Page, for example having a link saying "Sign Up Here" and be directed to a Klaviyo-hosted signup page where a customer can sign up! You can read more about this using this article. 

Let me know if something needs clarification,

Alex
 

Thank you so much that worked!!!!!!!!

I can now try to figur out how to fix up the page 

Again THANK YOU SO MUCH! 

Great to hear @Oliveblessed5! Glad I could help.

Thanks for being a member of the Community!
Alex

Hi, I followed the above advice but this grey box keeps appearing where I’m trying to embed this embeded Klaviyo form into my shopify page. Please advise what I’m doing wrong, thank you! 

Hi there @sevenswim,

This could be occurring for a few possibilities. 

I would suspect that there's something on the website refusing the connection for the Klaviyo embedded form. Klaviyo's forms are all populated via the Klaviyo.js. So something on your site (or just your browser) is preventing that embed code from loading.

The website might be seeing this as an external source and thus blocking the connection for it. 

I would also double check to see the form is properly installed.

Let me know your findings,

Alex

Hi, I have a couple of issues - 

• the ‘add section’ option only appears  when i am editing the homepage and I want to embed the form on a page that is not the homepage
• within the ‘add section’ drop down, there is no ‘custom content’, ‘custom HTML’ or ‘custom liquid’ option. 

What am I missing?? 

Thanks

Steph 

Hi there @StephanieStrykk,

Sorry to hear you’re running into problems. Our help center article does mention that you will want to click Add section in the left sidebar on the bottom of the area in the screenshot you shared, and then you should be able to select Custom Liquid.​ After that you should be able to paste the snippet into the Custom Liquid text box. 

If you are not seeing this appear on your Shopify app, I would consider reaching out to the shopify support team first to see if there is a bug or something we do not have the details of on Klaviyo. 

To install an embedded signup form, I would also recommend following the instructions found in the Where to Paste a Form's Embed Code article to assist in guiding you through how to install the embed code in a variety of ways depending on where you wish to install the code.

Let us know what they report,

Alex

Hi community :) 

I am struggling with the form and shopify

 I am just getting the link on the page .. 

i would like to run few promotions and need a link to a page not a pop up 

https://www.bucketsandspades.com.au/pages/sign-up-form

Hi @Buckets and Spades,
Can you confirm that your Shopify integration is properly installed and you have set up everything with troubleshooting advice from this thread?

It looks like something might be missing with the syntax in your product.liquid or just the integration in general.

I am trying to figure out how to add the Klaviyo embed form on the home page of my website. I have followed a tutorial that says to "add a section" and select apps, enter the Embed form code. They say I can move it around like a section and nothing is populating. I'm just not sure how to make it populate. 

Hope I'm explaining it correctly. Any questions are welcome.