Lazy Loading Breaking Site

  • Resolved nathangervenak

    (@nathangervenak)


    3 years, 3 months ago

    I recently updated to Siteground Optimizer version 6.0.4 and the Lazy Load option is breaking my images. My src tag is all messed up. The src looks something like this: src=”data:image/gif;base64,R0… </div></div></div><div class=” This is breaking my images, but also is messing up the entire layout.

    To fix the problem all I have to do is disable Site Ground Lazy loading.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Elena Chavdarova

    (@elenachavdarova)

    Hello @nathangervenak,

    A fix is already applied on the SiteGround Optimizer version 6.0.5. You can update the plugin and enable Lazy Loading for the website.

    Best Regards,
    Elena

    Hi, I have the plugin 6.0.5 but the lazy load still breaks my website.

    In particular it breaks my figure caption. Without the lazyload the code looks like

    <figure id="attachment_6898" aria-describedby="caption-attachment-6898" style="width: 500px" class="wp-caption aligncenter"><a href="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?ssl=1" data-slb-active="1" data-slb-asset="992281328" data-slb-internal="0" data-slb-group="6896"><img loading="lazy" class="wp-image-6898" src="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=500%2C226&ssl=1" alt="Creating the first workspace" width="500" height="226" srcset="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?w=618&ssl=1 618w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=300%2C135&ssl=1 300w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=150%2C68&ssl=1 150w" sizes="(max-width: 500px) 100vw, 500px" data-recalc-dims="1"></a><figcaption id="caption-attachment-6898" class="wp-caption-text">Creating the first workspace</figcaption></figure>

    With the lazy load
    <figure id="attachment_6898" aria-describedby="caption-attachment-6898" style="width: 500px" class="wp-caption aligncenter"><a href="https://www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png" data-slb-active="1" data-slb-asset="858202475" data-slb-internal="0" data-slb-group="6896"><img class="wp-image-6898 ls-is-cached lazyloaded" src="https://www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png" data-src="https://www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png" alt="Creating the first workspace" width="500" height="226" data-srcset="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?w=618&ssl=1 618w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=300%2C135&ssl=1 300w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=150%2C68&ssl=1 150w" sizes="(max-width: 500px) 100vw, 500px" srcset="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?w=618&ssl=1 618w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=300%2C135&ssl=1 300w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=150%2C68&ssl=1 150w"><figcaption id="caption-attachment-6898" class="wp-caption-text"><noscript><img class="wp-image-6898 lazyload" src="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=500%2C226&ssl=1" alt="Creating the first workspace" width="500" height="226" srcset="https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?w=618&ssl=1 618w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=300%2C135&ssl=1 300w, https://i2.wp.com/www.playembedded.org/blog/wp-content/uploads/2020/05/Creating-a-workspace.png?resize=150%2C68&ssl=1 150w" sizes="(max-width: 500px) 100vw, 500px" data-recalc-dims="1"></noscript></figcaption></a> Creating the first workspace</figure>

    Apparently the lazy load breaks the order of the tags and the figcaption got messed

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Lazy Loading Breaking Site’ is closed to new replies.