AO does not “know” what is above the fold and what is not, as that is only known in the browser, not on the server, but you can always use the comma-separated “lazyload exclude” field to list exclusions. Additionally you can also add the skip-lazy class to any image you wish to exclude from being lazyloaded (and that will work in most lazyload plugins).
hope this helps,
frank
Thank you for your immediate response.
Can you guide me how I can add skip-lazy to first img in page(all page/cat/tag/post)
found this for another plugin :
/**
* Disable lazyloading from first blog image
*/
function add_responsive_class($content){
if ( is_single() ) {
$content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
$document = new DOMDocument();
libxml_use_internal_errors(true);
$document->loadHTML(utf8_decode($content));
$imgs = $document->getElementsByTagName('img');
$img = $imgs[0];
if ($imgs[0] == 1) { // Check if the post has images first
$img->setAttribute('class','alignnone size-full remove-lazy');
$html = $document->saveHTML();
return $html;
}
else {
return $content;
}
}
else {
return $content;
}
}
add_filter ('the_content', 'add_responsive_class');
function rocket_lazyload_exclude_class( $attributes ) {
$attributes[] = 'class="alignnone size-full remove-lazy"';
return $attributes;
}
add_filter( 'rocket_lazyload_excluded_attributes', 'rocket_lazyload_exclude_class' );
source
hmm, your first image is likely your logo, which you can exclude manually as the filename is the same for all pages? 🙂
the method does have some merit, but however smart we try to make it, it will never *really* know what not to lazyload, as server-side we don’t know in which browser what images will be above the fold.
if I have some time in the next couple of days (I don’t now) I’ll try to write a similar code snippet that hooks into Autoptimize 🙂
I added the base logic for not lazyloading the X first images in AO core, see https://github.com/futtta/autoptimize/commit/a691dcd87502d88811f810bec2b54be26ac768a3
With that (rather small) change not lazyloading the first 5 images is as easy as adding this code snippet;
add_filter( 'autoptimize_filter_imgopt_lazyload_from_nth', function(){return 5;});
I might, at a later point, even add this as an option on the settings page.
If you want to try this out now (I hope you do), then you can download AO Beta 2.8 from https://github.com/futtta/autoptimize/archive/beta.zip (be sure to disable the current version before enabling the beta) and let me know if this works for you?
I installed the plugin and it worked fine.👌 I will also be waiting for the cache feature to be added in future versions🙏
-
This reply was modified 2 months, 3 weeks ago by
p47ri0t.
https://wordpress.org/support/topic/the-best-cache-plugin-for-wordpress-2/
“AO does not do page caching (yet), but I guess you’re aware of that:)”
I have not forgotten even though a year has passed 😉
