Lazy Load and image size

  • Resolved guidotg

    (@guidotg)


    2 years ago

    I am lazy loading successfully images inside a slider. However, with lazy load enabled the images are displayed stretched to a square and wrong size. If I disable lazy load the images look correctly and with their proper size.
    I’m looking into this but can’t seem to find a fix for that.
    Would you mind to have a look at it and tell me what I am missing?
    Thanks a lot

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support Dimo Dimov

    (@dimodi)

    Hello @guidotg,

    I have reviewed the reported issue and it appears to be caused by a conflict with the slider plugin you are using. This is most likely due to the fact that the RoyalSlider plugin offers its own lazy load feature. It is currently disabled but according to my tests, it still seems to interfere when other plugins are trying to lazy load the slider images. I tried tweaking the slider settings (image size, scaling, etc.) but with no success. With that being said, you may consider simply using the RoyalSlider built-in lazy load option.

    Regards,
    Dimo

    Thread Starter guidotg

    (@guidotg)

    Unfortunately, I cannot use built-in lazy load from RoyalSlider since the plugin does not use alternate text for the images with lazy load enabled.
    I will try to find a workaround and maybe tweak the plugin source code. Can you tell me more about the conflict between the two plugins?
    Thanks!
    Guido

    Plugin Support Pavel Dosev

    (@pdosev)

    Hello @guidotg,

    I checked the site, and you should be able to correct this by excluding the class of your slider. This way, however, the slider images won’t be lazy-loaded, but the plugin caches them.

    You can go to your admin page >> SG Optimizer >> Media >> Exclude CSS Classes from Lazy Load.

    You can add “rsImg” (without the quotes), which will exclude the slider images from our Lazy load, and they will load correctly.

    Thread Starter guidotg

    (@guidotg)

    Hello @pdosev,
    thank you for your help.
    Unfortunately this does not fix the problem.
    Not lazy loading the slider images heavily affects the page performance and, as a consequence, SEO. Lighthouse gives a performance score of 70, was 99 with lazy load enabled.
    The whole point of this topic is about using SGO lazy load, which clearly interferes with images. In debugging I set a breakpoint on attribute modifications for the img element and I can see that lazysizes.min.js makes the images resize incorrectly.
    So adding the rsImg class to the exclude list is the same as disabling lazy load feature on this page.

    • This reply was modified 2 years ago by guidotg.
    Plugin Support Plamen M

    (@plamenm)

    Hello @guidotg,

    Please, post a support ticket through your SiteGround user area so that we can check the reported issue directly in your staging site.

    Thank you.

    Regards,
    Plamen.M
    Tech Support Team
    SiteGround.com

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Lazy Load and image size’ is closed to new replies.