Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #1344146

    Hi Genius’,

    Is there a way to make a product slider revert to only 1 column on devices (max-width: 428px) and 2 columns on devices (max-width: 640px). I plan to use 5 column product sliders on desktop on every page. Link to current page with slider

    I have searched and found this thread but I couldn’t adapt it as it requires adding to the functions file which I wanted to avoid. I also wanted to avoid the duplication method as I’m hitting the argument with third parties that Google is classing the double slider as “double content”.

    Very best wishes,


    Hey Annemarie,

    It’s breaking to 1 column at 479, and to 2 columns at 767. I think that there would not be much of a point in changing those break points?

    Best regards,


    Hi Rikard, yes thanks. I take your point… my APOLOGIES it was MY MISTAKE because on mobile, I saw the first two products stacking and the slider arrows still showing between the two products which made me think I would be viewing 2 products at a time but now I see all 5 products were stacked so I will just find a way to make the arrows disappear on mobiles less than 479.
    Thanks for your valuable time!
    — Annemarie


    Hi Annemarie,

    Please add following code to Quick CSS field in Enfold theme options > General Styling tab

    @media only screen and (max-width: 480px) {
    .avia-product-slider-container .avia-slideshow-arrows {
      display: none;

    Best regards,


    Wow, you guys go beyond, THANK YOU Yigit, I wasn’t even expecting you to fix it for me… you made that so easy for me!
    Best wishes,
    — Annemarie


    Hi Annemarie,

    You are welcome! Let us know if you have any other questions and enjoy the rest of your day :)

    Best regards,

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Product Slider – Revert to 1 column on mobile’ is closed to new replies.