Solved

Why is the section overlapping the header in the Venture theme on Shopify?

mika94
Tourist
7 0 2

 How do you move the section down so it will not overlap the header? I am not so sure how to modify the code to do this. The theme is Venture.

This is the URL

https://urbanhouseclothing.com/

 

Accepted Solutions (2)

g33kgirl
Shopify Partner
390 109 142

This is an accepted solution.

UPDATED CODE: You can add this at the end of your CSS file (Themes -> Edit code -> Assets -> theme.scss.css😞

 

#shopify-section-slideshow + div {
  margin-top: 100px;
}

 

 

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl
If you're not comfortable with code, please modify code files at your own risk.

View solution in original post

g33kgirl
Shopify Partner
390 109 142

This is an accepted solution.

No, you need to navigate to Themes -> Actions -> Edit code -> Assets -> themes.scss.css (scroll to the very end of this file and add the above code there). I have added pictures for reference:

Screenshot 2021-04-29 at 1.46.34 am.png

Screenshot 2021-04-29 at 1.46.51 am.png

 

Screenshot 2021-04-29 at 1.52.30 am.png

 

Don't forget to SAVE the file.

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl
If you're not comfortable with code, please modify code files at your own risk.

View solution in original post

Replies 8 (8)

g33kgirl
Shopify Partner
390 109 142

This is an accepted solution.

UPDATED CODE: You can add this at the end of your CSS file (Themes -> Edit code -> Assets -> theme.scss.css😞

 

#shopify-section-slideshow + div {
  margin-top: 100px;
}

 

 

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl
If you're not comfortable with code, please modify code files at your own risk.
mika94
Tourist
7 0 2

Do I add a new section and then add this code? 

g33kgirl
Shopify Partner
390 109 142

This is an accepted solution.

No, you need to navigate to Themes -> Actions -> Edit code -> Assets -> themes.scss.css (scroll to the very end of this file and add the above code there). I have added pictures for reference:

Screenshot 2021-04-29 at 1.46.34 am.png

Screenshot 2021-04-29 at 1.46.51 am.png

 

Screenshot 2021-04-29 at 1.52.30 am.png

 

Don't forget to SAVE the file.

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl
If you're not comfortable with code, please modify code files at your own risk.
dmwwebartisan
Shopify Partner
12282 2546 3694

@mika94 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media only screen and (max-width: 749px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

@media only screen and (min-width: 750px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

Hope this works.
Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

Kinjaldavra
Shopify Partner
2302 570 1422

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

@media only screen and (max-width: 749px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 30px !important;}
}

@media only screen and (min-width: 750px){
.shopify-section--slideshow:first-child .hero { margin-bottom: 60px !important;}
}

 

mika94
Tourist
7 0 2

So to confirm this will move the section down right so it will not overlap with the header slideshow?

Hope I am using the right terms.

 

Screen Shot 2021-04-29 at 1.06.40 AM.png

Kinjaldavra
Shopify Partner
2302 570 1422

yes  confirm this will move the section down please insert code 

dmwwebartisan
Shopify Partner
12282 2546 3694

@mika94 

Please PM to me I help you.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app