Support » Plugin: Image Optimizer, Resizer and CDN - Sirv » Images should not resize in slider

  • Resolved master412160

    (@master412160)


    Hello, I just gave you guys 5 star review. To make this plugin even more perfect would be if I can also use its lazy loading feature.

    In order for that to happen it should not change the images in a slider for example. Just load them from your cdn as they are by default.

    I’ve tried the pre-loaded profiles and my own “test” profile but nothing I do results in what I want.

    https://imgur.com/a/3XQINae

    • This topic was modified 1 year, 1 month ago by master412160.
Viewing 5 replies - 1 through 5 (of 5 total)
  • We’re very happy that you’re enjoying Sirv!

    In general, Sirv will attempt to sync as serve as many images as possible. It can lazy load most of those images but sometimes it can’t access the image to edit its src to data-src and add a class of Sirv.

    Please send us the URL of that page where we can see the slider and also a login to your WordPress admin. We will see if there is a way to lazy load the images on your page, without lazy loading the images in your slider.

    The login should be sent via our secure form:

    https://sirv.com/contact/

    Thanks!

    Thread Starter master412160

    (@master412160)

    Hello,

    I’ve filled out the form! Sorry for the long delay.

    Regards

    We found the cause of the unexpected image dimensions when lazy loading is enabled.

    Your images are inside Owl carousel, which has some styles that are breaking the layout:

    .mkdf-owl-slider .owl-item img {
        width: 100%;
    }
    
    .mkdf-show.info-bellow .mkdf-show-image a {
        height: 183.32px !important;
    }

    Those styles set dimensions for images which are obeyed by Sirv lazy loading. Instead, the styles should be responsive, to fit the available carousel area.

    Add the following CSS to your HTML page to fix the issue:

    <style type="text/css">
        .mkdf-owl-slider .owl-item img {
            width: auto !important;
        }
        .mkdf-owl-slider .mkdf-show.info-bellow .mkdf-show-image a {
            height: auto !important;
        }
    </style>

    We will add a new field in the next version of the Sirv plugin where you can paste those styles. (Alternatively, you could replace the styles in Owl carousel, but the fix would be overwritten if you updated Owl carousel in future.)

    The new plugin version will be released in a few days and we’ll email you then.

    Just to confirm that the Custom CSS field was added to the Sirv plugin and released as a new version last week.

    Thanks for using Sirv!

    Thread Starter master412160

    (@master412160)

    Thank you for your assistance! Top support!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Images should not resize in slider’ is closed to new replies.