I want change the Image slider’s options on Desktop and Mobile
On desktop, I want to show all photos (like without slider), and on mobile I want to show the photos on slider.
I try it adding more rows on Desktop size, but when I edit on Mobile size for one only row, the editor change Desktop configuration too and viceversa.
Preview link:
http://1e1ca2-511f3.preview.sitejet.io/product
Hi! I guess the easiest way is to override the CSS for the slider.
Here is the (S)CSS to do it:
// using media query for screen bigger than tablet
@media screen and (min-width: $breakpoint-md) {
// this is your slider id
// if you want to target all sliders you can use the .ed-slider class
#ed-67593731 {
.slick-track {
display: flex;
flex-direction: column;
width: 100% !important;
transform: none !important;
}
.slick-next,
.slick-prev,
.slick-dots {
display: none !important; //hides prev + next + dots from slider
}
}
}
Hope this helps.
Thank you!, that works for me 
A very elegant way to solve this. I usually also recommend a no-code option:
Just make the desktop slider visible for desktop and set up a new slider just for mobile and customize it.
How can you create a slider just for mobile?
Are there settings that manage what can be seen only on mobile and not on desktop?
Or does code have to be written to accomplish this?
Thanks!
