This page has two Klaviyo Sign-Up sections on it.
The first is right below this text with the solid yellow background.
The second is right above the footer with an image as the background.
This page has two Klaviyo Sign-Up sections on it.
The first is right below this text with the solid yellow background.
The second is right above the footer with an image as the background.
Let's talk about the Klaviyo sign up section. we use Clearview for all of our clients stores, for email to consumers and sign up forms are an important part of our email collection strategy. And you'll have pop up forms. But this section is for embedded forms. And on this page you can see two examples of email signup forms that are embedded.
There's this one here which is in the middle of content, and there's this one here down at the bottom of the page, and it goes full width and kind of looks like it's part of the header. Now both of these are actual forms that are created in Klaviyo and then we embed them inside of our Shopify website. So if we look here we can see we have two forms in Klaviyo.
One is get our free guide. The others be the first to know. So there's get our free guide. And here's the be the first to know and what we need to do once we create the forms inside of Klaviyo as we create them, they will appear inside of Shopify. But you'll notice on this one.
We've got a transparent background. So the yellow background that you see comes from our section. And in the other one.
Which is at the bottom of the page near the footer which has the image behind it.
You'll see it is also a transparent form. So that image is coming from the section settings. Now you can in your forms have color backgrounds and background images, but they don't render well inside of Shopify. So we find that having the background done at the section level is a more elegant way to do it, and a more predictable way to no experience.
You're going to be getting. To get this into your store. You first have to have the app installed and then make sure that the Klaviyo signup section is installed or added to your theme. Now this section is available on a lot of different page types and templates, including even the footer, so you can use it throughout your store experience.
And what it looks like is when you add the section to any of the templates that it's supported by. Like, you're right here, the JP Klaviyo signup, what you do is you put in the embed code for the element, and notice we allow a different desktop and mobile if desired. embed code. So where you get your embed code in your form and you go back to Klaviyo and you look at targeting behavior and you'll see right here that here's the embed code.
And you just select that and copy it and go back to your theme customization. And you can drop it right in there. Now if you want the same form to show up on mobile and desktop, just put it in twice. I'm going to delete this section that I added and show you the other two that we've already created.
So here's the one with the yellow background that we're using in the middle of content. And you can see we've got the same embed code put in twice. This one. We're giving a background color for the yellow. And we've set the width of this section to be half so it doesn't go even the full 1200 pixel width of the content.
It's smaller than that. And one of the nice things we have in here is the ability to also restrict the width of the form itself. And that's this slider right here. So I can take that down to 400 if I want to. Have to save that to see what that looks like here in theme customization.
And that that element was already less than that size. If I take it up to wide or let's go to standard, you'll see what it does.
So it just constricts the form to be within that that width size. And the rest of it is margin on the outsides. And then on our element that has the background image, you can see here we set a background image. And right now and this is the normal way I do it most of the times I'll have that background image go full width, but we can also change the width of that to be standard if we wanted to.
So this element allows you to add those clever forms that you make inside of clay view. Right. So if someone clicks on this, you know, if you want your customers clicks on it on the front end.
And types in their information here that's going to go straight to click view. It's not going into Shopify. It's going to click view. And the form also supports the multiple sections of the form. So you can see here I've got an opt in section that I'm on. And then once it's submitted there's a success page that also will show up inside using that embed code in the section settings.
That's it for the Klaviyo signup form.
Thanks for watching.
Let's talk about the Klaviyo sign up section. we use Clearview for all of our clients stores, for email to consumers and sign up forms are an important part of our email collection strategy. And you'll have pop up forms. But this section is for embedded forms. And on this page you can see two examples of email signup forms that are embedded.
There's this one here which is in the middle of content, and there's this one here down at the bottom of the page, and it goes full width and kind of looks like it's part of the header. Now both of these are actual forms that are created in Klaviyo and then we embed them inside of our Shopify website. So if we look here we can see we have two forms in Klaviyo.
One is get our free guide. The others be the first to know. So there's get our free guide. And here's the be the first to know and what we need to do once we create the forms inside of Klaviyo as we create them, they will appear inside of Shopify. But you'll notice on this one.
We've got a transparent background. So the yellow background that you see comes from our section. And in the other one.
Which is at the bottom of the page near the footer which has the image behind it.
You'll see it is also a transparent form. So that image is coming from the section settings. Now you can in your forms have color backgrounds and background images, but they don't render well inside of Shopify. So we find that having the background done at the section level is a more elegant way to do it, and a more predictable way to no experience.
You're going to be getting. To get this into your store. You first have to have the app installed and then make sure that the Klaviyo signup section is installed or added to your theme. Now this section is available on a lot of different page types and templates, including even the footer, so you can use it throughout your store experience.
And what it looks like is when you add the section to any of the templates that it's supported by. Like, you're right here, the JP Klaviyo signup, what you do is you put in the embed code for the element, and notice we allow a different desktop and mobile if desired. embed code. So where you get your embed code in your form and you go back to Klaviyo and you look at targeting behavior and you'll see right here that here's the embed code.
And you just select that and copy it and go back to your theme customization. And you can drop it right in there. Now if you want the same form to show up on mobile and desktop, just put it in twice. I'm going to delete this section that I added and show you the other two that we've already created.
So here's the one with the yellow background that we're using in the middle of content. And you can see we've got the same embed code put in twice. This one. We're giving a background color for the yellow. And we've set the width of this section to be half so it doesn't go even the full 1200 pixel width of the content.
It's smaller than that. And one of the nice things we have in here is the ability to also restrict the width of the form itself. And that's this slider right here. So I can take that down to 400 if I want to. Have to save that to see what that looks like here in theme customization.
And that that element was already less than that size. If I take it up to wide or let's go to standard, you'll see what it does.
So it just constricts the form to be within that that width size. And the rest of it is margin on the outsides. And then on our element that has the background image, you can see here we set a background image. And right now and this is the normal way I do it most of the times I'll have that background image go full width, but we can also change the width of that to be standard if we wanted to.
So this element allows you to add those clever forms that you make inside of clay view. Right. So if someone clicks on this, you know, if you want your customers clicks on it on the front end.
And types in their information here that's going to go straight to click view. It's not going into Shopify. It's going to click view. And the form also supports the multiple sections of the form. So you can see here I've got an opt in section that I'm on. And then once it's submitted there's a success page that also will show up inside using that embed code in the section settings.
That's it for the Klaviyo signup form.
Thanks for watching.