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

    Hi there.

    We’re using theme Propulsion and like it very much. On the front start page we have a massive product slider showing ca 100 products. However this does not work so great with the mobile version of the site. I would like to disable it for mobiles. How can this be achieved?

    I’ve already tried the css display:none trick and that works of course. But the 100 products are still loading which means that the site takes for ever to load on a mobile and is therefore completely useless for impatient mobil users.

    #217476

    Hey Chris!

    Please try adding following code to Quick CSS in Propulsion theme options under Styling tab

    @media only screen and (max-width: 480px) {
    .shop_slider_yes {
    display: none!important;
    }}

    Cheers!
    Yigit

    #217478

    But that is just hiding the slideshow. The slideshow with the 100 product images are still loading. Taking both bandwidth and time.

    I want the slider not to be loaded at all on mobile devices.

    #218460

    Hey!

    In that case you would need to hire a freelance developer write a custom function to detect the users viewport and then remove the content before it loads.

    The theme unfortunately does not have anything like that built in.

    Regards,
    Devin

    #218810

    I understand.

    Is there perhaps somebody at this forum that has tried to disable the slider only for mobiles? How did you solve it? I would image that most people that uses a big product slider would want to disable it for mobile view due to the heavy load time.

    Devin would you mind giving some quick pointers of how that algorithm would function?

    #219513

    Typically users have just not used a large image heavy slider. The current trend in web development is “mobile first” where you design for mobile viewers first and scale up/add for desktop users if needed at all.

    The gist of it would be detecting the current users screen width before content loads in and then using some if then logic to show or hide the element. Its very very general but I can’t really be more specific than that unfortunately.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.