At the moment, almost all plug-ins for the implementation of deferred loading do not support the exclusion of images by attribute. This function would be very much in demand by webmasters working with the designer of the ELEMENTOR pages.
Hey @sdudchenko,
happy that you like the plugin 🙂
Excludind by attribute sounds like an interesting approach. But I don’t see an attribute in your example (I think you don’t mean the src attribute? 🙂 ). Could you update the example?
Thanks,
Florian
Applying the cpc attribute in general would be the most excellent solution, since it will allow the web master to prepare a separate image for the delayed download.
Below I have provided the most ideal list of attributes for which you can exclude images from the delayed loading.
[src=”https://techblog.sdstudio.top/wp-content/uploads/2018/12/MainLogo.png”]
[alt=”ThisNoLazy”]
[title=”ThisNoLazy”]
[width=”540″][height=”512″]
[srcset=”https://techblog.sdstudio.top/wp-content/uploads/2018/12/Dostavka-1.png 540w, https://techblog.sdstudio.top/wp-content/uploads/2018/12/Dostavka-1-300×284.png 300w”]
[data-src=”https://techblog.sdstudio.top/wp-content/uploads/2018/12/Dostavka-1.png”%5D
-
This reply was modified 7 years, 4 months ago by
s.dudchenko.
I cannot exclude the lazy loading via those attributes, sorry. The attributes with src are there for the most images, so no ideal candidate for exclusion. The same goes for width and height. And alt and title are attributes that should be used for what they were designed for, not to give a hint to a plugin.
What exactly does not work with Elementor and Lazy Loader?
Unfortunately, the page constructor does not allow to set my class in the img element. Therefore, I don’t have the option to exclude images that appear immediately when the page loads from the delayed loading. And it is very “hit” in the eyes.
If it is possible to exclude images by:
srcset
title
alt
data-src
This should also be enough to exclude images set in the page builder ELEMENTOR.
-
This reply was modified 7 years, 4 months ago by s.dudchenko.
-
This reply was modified 7 years, 4 months ago by s.dudchenko.
Perhaps I did not quite correctly put it, in the plugin it should simply be possible to specify any value for the most necessary list of attributes. And then not a hint of the plugin will not be
Florian Brinkmann, I can gladly help you with testing or provide any other help as before. Thanks again.
Can you set classes to wrapper elements of the images? Then I could check out if it is somehow possible to exclude a whole part of HTML instead of just specific images.
Yes, I can specify classes for wrapping, and in the constructor ELEMENTOR if I specify the class
NO_LAZY
In the page code, this element will look like this:
<div data-id="d12f2cf" class="elementor-element elementor-element-d12f2cf NO_LAZY elementor-widget elementor-widget-image" data-element_type="image.default">
<div class="elementor-widget-container widget-area">
<div class="elementor-image">
<img width="540" height="512" src="https://techblog.sdstudio.top/wp-content/uploads/2018/12/Dostavka-1.png" class="attachment-medium_large size-medium_large" alt="" srcset="https://techblog.sdstudio.top/wp-content/uploads/2018/12/Dostavka-1.png 540w, https://techblog.sdstudio.top/wp-content/uploads/2018/12/Dostavka-1-300x284.png 300w" sizes="(max-width: 540px) 100vw, 540px">
</div>
</div>
</div>
All right, I will try to find a way for it.
Thank you very much, if you need help, I will be happy to help.
Hello, is there any success? And do I need my help?
Hi @sdudchenko,
I think I found a working solution. I will try to release a Beta version today or tomorrow (likely tomorrow) and send you a link so you can test it.
Thanks,
Florian
Thank you for your work, I look forward to :).
Hey @sdudchenko,
I was not able to release a final version today, because I struggle with another feature that worked during tests but does not work now…
However, you can download a beta from GitHub (https://github.com/florianbrinkmann/lazy-loading-responsive-images/releases/tag/v3.5.0-beta.3 – the lazy-loading-responsive-images.zip) and try it. It contains the feature to disable lazy loading for elements with the disable-lazyload class and its children.
Would be great if you could give it a try and report if that works for you.
Thanks,
Florian
