How can I properly embed Klaviyo forms in my theme?

samlarge · ‎10-07-2022

Trying to embed a form from klaviyo and the width and alignment in my theme is giving me a lot of trouble.

When viewing desktop version essentially it previews the mobile look of the form so its really small and left aligned rather than being full width and centered. I've included screenshots from klaviyo and from Shopify.

GabrielS · ‎10-07-2022

Hi,

Adding the below CSS code at the end of your base.css file may address your issue.

.klaviyo-form-YfyKwZ {
width:100% !important;
}

For a better relevancy, please share your website link.

Cheers!

Gabriel Soare | Web Developer
Are you looking to customize your Shopify or to fix a website bug?
You can reach me through my website gabrielsoare.com, DM, or email hello@gabrielsoare.com.
Have I helped you? Like my post.

View solution in original post

GabrielS · ‎10-07-2022

Hi,

Adding the below CSS code at the end of your base.css file may address your issue.

.klaviyo-form-YfyKwZ {
width:100% !important;
}

For a better relevancy, please share your website link.

Cheers!

Gabriel Soare | Web Developer
Are you looking to customize your Shopify or to fix a website bug?
You can reach me through my website gabrielsoare.com, DM, or email hello@gabrielsoare.com.
Have I helped you? Like my post.

samlarge · ‎10-07-2022

Sweet thannk you that worked

How can I properly embed Klaviyo forms in my theme?

How can I properly embed Klaviyo forms in my theme?

Community Blog Articles