Need help adding margin above Klaviyo form

Solved
BeddingBros
New Member
2 0 0

Hi,

I have added a Klaviyo email form to my store using Debut theme (beddingbros.com) and need to increase top margin between it and the body. 

It is currently set to appear in the footer on all pages with the following code being added into footer.liquid:

Klaviyo Capture.PNG


Thanks in advance!

0 Likes
Natztech
Shopify Partner
683 189 459

@BeddingBros  please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.template-index .klaviyo-form-XHbLef{
   margin-top:100px !important;
}
Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
Ninthony
Shopify Partner
1804 261 712

This is an accepted solution.

You can either do this with @Natztech 's suggestion, or the option probably exists in the Klaviyo Admin. Alternatively if you didn't want to use the !important flag, you could wrap your Klaviyo div inside another div, then apply margin to that:

<div class="klaviyo-form-wrapper">
  <div class="klaviyo-form-XHbLef"></div>
</div>

 

Then add the css in Assets/theme.css:

.klaviyo-form-wrapper {
  margin-top: 100px;
}

 

If my solution helped you, please like and accept as solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
BeddingBros
New Member
2 0 0

Thank you both! @Ninthony @Natztech 

0 Likes