Is there another way the plugin allows users to exclude content from lazy loading?

This probably isn’t related to GP but I’m hoping someone has run into this issue.

Hello guys!

This might be a silly question but here it goes:

I’m using “Delay” JS scripts (I’m using LiteSpeed for caching), but I want my ConvertKit subscribe form to load instantly. How can I do that? I know there’s a way to exclude from defer/delay but have no idea about the name of the script(s) I should be excluding.

The form is above the fold and uses a script in a custom HTML field that’s similar to this: “<script async data-uid=”c19ba70112″ src=”https://site.ck.page/c19ba70112/index.js“></script>

Thank you in advance!

Using your plugin, how can we exclude images above the fold from lazy loading? We would still like to retain the ability to resize and convert them to AVIF.

Thank you

Go to page, above the fold header content like text, pictures, video, etc, do not load, until you move the mouse in the viewport area or touch screen on mobile. Then they all load with their animations respectively.

Anyone run into this before? Trying to figure out what I’m missing to have the entrance animations just start right away upon load, and paint the text, pic, vid in the above the fold header right away and lazy load all the rest as usual.

TIA

Cloudlinux 8.7
cPanel
LSWS
Elementor

Thanks for your help!

When working with non-dynamic ‘above the fold’ images, I simply apply the class ‘skip-lazy’. This works successfully. The same strategy cannot be applied to images within the Query Loop Block because any class applied to one image will propagate to every other image of the same kind

• Example: Applying ‘skip-lazy’ to the Featured Image of the first post displayed by Query Loop will apply the same class of ‘skip-lazy’ to the Featured Images of all posts within the same Query Loop Block (thus defeating the benefit of lazy-loading altogether).

I have also tried targeting ‘above the fold’ images using a jQuery script to apply the class ‘skip-lazy’ only to the very first image within the Query Loop. This succeeds in adding the class ‘skip-lazy’ to the Query’s first image, but the image still never loads.

<script>
jQuery( document ).ready(function() {
	jQuery('.wp-block-post-content').find('img:first').addClass( "skip-lazy" );
});
</script>

Do you have insights to share? Can you recommend a working solution?

Thank you for your consideration and for your thoughtful reply.

Is there any way you guys can add the lazy loading features listed below to your plugin?

Perfmatters (plugin) offers them and they work great.

Requested Features:

1. Auto exclude images above the fold.
2. Add preview thumbnails to YouTube, Hulu, etc. videos.
3. Add a fade-in effect to lazy loaded images (with a separate filter to control the fade-in time).
4. Exclude images from lazy loading using the image URL (without using your filter). Details: https://prnt.sc/ivZUmDyyOcBW
5. Option to lazy load CSS background images.

Thank you!

It will be a good thing to have a sub-option for lazy load to choose if yes or not we want the Above-the-fold img to be lazyloaded or not

Learn more :
https://web.dev/lcp-lazy-loading/

When running google pagespeed insights, i get told that an image above the fold is retrieved larger than its actual visual resolution. See image in link (danish) https://gyazo.com/8a53993073f87b614d79d773c7752ff8

The images below in the articles loads correctly on small screen sizes.

Why isnt the first image being retrieved in the correct size as specified in the srcset?