Debut theme: Hide slideshow section on desktop and keep on mobile.

Solved
Highlighted
Excursionist
44 0 7

I would like to hide the slideshow section on desktop and keep it on mobile devices. Here is my website link https://pimp-your-animal.myshopify.com/ and here is the section:dc10327a8e341397ca68ac88c7166c71.jpg

0 Likes
Highlighted
Shopify Partner
2227 483 626

This is an accepted solution.

Hi

add code assets/theme.scss.liquid bottom of the file

 

.index-section--slideshow {display:none;}

@media only screen and (max-width: 749px){
.index-section--slideshow {display:block;}
}

Hope this will work for you.


Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
1 Like
Highlighted
Excursionist
44 0 7

Thank you! That has worked. Could you also please help me make that slideshow section clickable on mobile? So when i click it links me to all my products? Thanks.

0 Likes
Highlighted
Excursionist
44 0 7

@dmwwebartisan  Thank you! That has worked. Could you also please help me make that slideshow section clickable on mobile? So when i click it links me to all my products? Thanks.

0 Likes
Highlighted
Shopify Partner
2227 483 626

Sure will check slider for mobile but Please above post give like and accept as solution. This is cost of my time.

Will check for mobile and get back to you.

 

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Excursionist
44 0 7

Thank you i just done that :)

0 Likes
Highlighted
Excursionist
44 0 7

@dmwwebartisan Thank you! I just done it.

1 Like
Highlighted
Tourist
3 0 1

Hello. I got this to work on my debut site. I also added another section so that it did the opposite, ie One slideshow displays on desktop and one on mobile. Only issue is on the mobile site as the "hidden" slideshow is below missing the slideshow overlaps the section above. Any ideas on a fix?

 

here is the full code I used in my theme.scss.liquid file

.index-section--slideshow {display:none;}

@media only screen and (max-width: 749px){
.index-section--slideshow {display:block;}
}


.index-section--mobile-slideshow {display:none;}

@media only screen and (min-width: 750px){
.index-section--mobile-slideshow {display:block;}
}

 

Thanks 

Aarondesktop view.PNGmobile view.PNG

0 Likes