Lazy loading still enabled even though all lazy load options are seemingly disabled

This topic has 12 replies, 2 voices, and was last updated 3 months, 3 weeks ago ago by Luca Rossi

  • Avatar: Applesandcider
    Applesandcider
    Participant
    November 19, 2024 at 19:51

    Hi! There is a lazy loading issue with your product image grid. We’ve turned off all the Image-lazy-loading options on “XStore Speed Optimization” and “Elementor”. But it still injects the [loading=”lazy”] attribute into the images. This abnormal [loading=”lazy”] code injection happens on mobile view, particularly.

    You can check them from the home page (see PCA).
    I also created a separate page to isolate the issue by adding the problematic block (see PCA)

    Please, contact administrator
    for this information.
    Files is visible for topic creator and
    support staff only.
    11 Answers
    Avatar: Applesandcider
    Applesandcider
    Participant
    November 20, 2024 at 07:53

    Further testing has shown that when we disable all plugins and analyse the Xstore widgets, the lazy load code is still there. The lazy load code is not shown on any other widgets except Xstore’s.

    Further more, we have activated plugins like “Disable Lazy Load” plugin and it does not remove Xstore’s lazy load code.

    Any help on this would be really appreciated.

    Avatar: Justin
    Luca Rossi
    Support staff
    November 20, 2024 at 10:13

    Hi @Applesandcider,

    Do you mean the loading icon on each XStore widget?

    https://prnt.sc/YeAYYMQA9UHB

    It’s called Ajaxify. To completely disable this feature, please add the following code under functions.php file locates in your child theme:

    
    add_filter('etheme_ajaxify_elementor_widget', '__return_false');
    add_filter('etheme_ajaxify_lazyload_widget', '__return_false');
    add_filter('etheme_ajaxify_script', '__return_false');
    

    Then add the following CSS codes under XStore > Theme Options > Theme Custom CSS > Global CSS:

    
    /* Ajaxify Animation */
    body.elementor-default:not([data-elementor-device-mode]) [class*=elementor-widget-et-]>.elementor-widget-container,
    body.elementor-default:not([data-elementor-device-mode]) [class*=elementor-widget-etheme]>.elementor-widget-container,
    body.elementor-default:not([data-elementor-device-mode]) [class*=elementor-widget-woocommerce-etheme]>.elementor-widget-container,
    body.elementor-default:not([data-elementor-device-mode]) [class*=elementor-widget-woocommerce-product-etheme]>.elementor-widget-container,
    body.elementor-page:not([data-elementor-device-mode]) [class*=elementor-widget-et-]>.elementor-widget-container,
    body.elementor-page:not([data-elementor-device-mode]) [class*=elementor-widget-etheme]>.elementor-widget-container,
    body.elementor-page:not([data-elementor-device-mode]) [class*=elementor-widget-woocommerce-etheme]>.elementor-widget-container,
    body.elementor-page:not([data-elementor-device-mode]) [class*=elementor-widget-woocommerce-product-etheme]>.elementor-widget-container {
        opacity: 1;
        visibility: visible;
    }
    body.elementor-default:not([data-elementor-device-mode]) [class*=elementor-widget-et-]:before,
    body.elementor-default:not([data-elementor-device-mode]) [class*=elementor-widget-etheme]:before,
    body.elementor-page:not([data-elementor-device-mode]) [class*=elementor-widget-et-]:before,
    body.elementor-page:not([data-elementor-device-mode]) [class*=elementor-widget-etheme]:before {
        display: none;
    }
    /* Ajaxify Aniamtion */
    

    Hope it helps!

    Avatar: Applesandcider
    Applesandcider
    Participant
    November 20, 2024 at 10:30

    Hi Luca,

    I saw this code on other tickets and had already tried it and it did not remove the lazy load code. I also added !important to each one like a previous ticket did but that also did not work.

    May I ask you to kindly look into it for me to see if there is a solution?

    Thanks

    Avatar: Justin
    Luca Rossi
    Support staff
    November 21, 2024 at 07:09

    Dear @Applesandcider,

    We hope this message finds you well.

    We would like to bring to your attention that the Lazy Loading settings for the XStore theme and Elementor plugin appear to still be inactive, as shown in the following screenshots:

    – [Screenshot 1](https://prnt.sc/x_nV6fgXTLTv)
    – [Screenshot 2](https://prnt.sc/4EAZ-092ettb)

    However, we have noticed that the Lazy Loading functionality from the LiteSpeed Cache plugin is currently active, as indicated here: [Screenshot 3](https://prnt.sc/0otyguNJZa66).

    Could you kindly double-check the settings to ensure everything is configured as intended?

    Thank you for your time and assistance.

    Best regards,
    The 8Theme Team

    Avatar: Applesandcider
    Applesandcider
    Participant
    November 21, 2024 at 08:22

    Let me clarify again.

    We were able to activate “LiteSpeed Lazy-Loading” sitewide except for two XStore blocks/widgets.

    When LiteSpeed Lazy Loading: ON

    Here are the problematic blocks that are refractory for LiteSpeed Lazy loading. These blocks work fine on desktop view and cause problems on mobile view.

    1) XStore Products Grid: (See PCA)

    2) Banner Carousel: (See PCA)

    If you check the image, you should be clearly able to understand what the errors are.

    Some XStore widgets/blocks have the [loading=”lazy”] tag in the mobile view and XStore does lazy load those images in the mobile view, without respecting to the initial “lazy-load-turn-off” settings.
    This case the problem.

    Please contact administrator
    for this information.
    Avatar: Justin
    Luca Rossi
    Support staff
    November 21, 2024 at 10:05

    Hi @Applesandcider,

    The loading="lazy" attribute for the images is automatically generated by the Elementor plugin.

    We recommend trying the following plugin to address this: [Lazy Load Control for Elementor](https://wordpress.org/plugins/lazy-load-control-for-elementor/).

    If this does not resolve the issue, we kindly suggest reaching out to the Elementor Support Team for further assistance: [Elementor Support Forum](https://wordpress.org/support/plugin/elementor/).

    Best regards,
    The 8Theme Team

    Avatar: Applesandcider
    Applesandcider
    Participant
    November 21, 2024 at 21:42

    Hi! Elementor said that they can’t help.

    I have a request to resolve this.
    Please add a unique class name to the in the Products Grid block. Check this: https://prnt.sc/_fFuv8NjURqi

    If you can do this,
    We can exclude them using LiteSpeed without any issue. https://prnt.sc/WfYeXVvcYFA1

    In this case, you are using “etheme-product-grid-image” as the class for all your block. We cannot use this, this class is being using by many blocks.

    As I said, use unique class names for tag based on the block.

    Ex:

    For Products grid

    Avatar: Justin
    Luca Rossi
    Support staff
    November 22, 2024 at 05:58

    Hi @Applesandcider,

    Please add the etheme-product-grid-image class to the Lazy Load Image Parent Class Name Excludes field:

    https://prnt.sc/Z5wQNYTUHr17

    For more information, please take a look at this article: https://wordpress.org/support/topic/how-to-exclude-images-from-lazy-loading/.

    Hope it helps!

    Avatar: Applesandcider
    Applesandcider
    Participant
    November 22, 2024 at 06:16

    I appreciate your responsible reply.

    As I explained clearly, you use “etheme-product-grid-image” as a parent class name not only in the “Products Gird” block, but also in other blocks. When we use “etheme-product-grid-image”, LiteSpeed exclude such blocks from optimizing, this is not what we want.

    We want only exclude images inside “Products Grid” and “Banner Carousel” blocks.

    Thanks in advance.

    Avatar: Applesandcider
    Applesandcider
    Participant
    November 22, 2024 at 06:32

    Alternatively, please see comment from Elementor regarding the loading=lazy issue.

    They are saying it is an issue for the creator of the plugin which I believe is you guys?

    A solution to this problem would be greatly appreciated.

    Files is visible for topic creator and
    support staff only.
    Avatar: Justin
    Luca Rossi
    Support staff
    November 22, 2024 at 07:40

    Hi @Applesandcider,

    In this case, can you try with the following parent classes?

    – elementor-widget elementor-widget-etheme_product_grid
    – banner

    Alternatively, please see comment from Elementor regarding the loading=lazy issue.

    They are saying it is an issue for the creator of the plugin which I believe is you guys?

    As we mentioned in the previous reply, the XStore theme & XStore Core plugin don’t generate the loading=”lazy” to the images. You can search in source codes of XStore theme and XStore Core plugin. There is no codes related to the loading=”lazy” string.

    Best regards,
    The 8Theme Team

  • Viewing 12 results - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.