Remove Lazy loading on first image in Wordpress

Question

i want to remove lazy loading on the first image in Wordpress, for every posts, pages and home.

I don't use any plugins for lazy loading image, i need a solution for the default lazy loading add by wordpress.

I found this script for functions.php, but it is for WP Rocket plugin, and i haven't this plugin.

So i modified it in this:

function add_responsive_class($content){
    if ( is_single() || is_page() || is_front_page() || is_home() ) {
        $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','aligncenter size-full remove-lazy');
            $html = $document->saveHTML();
            return $html;
        }
        
        else {
            return $content;
        }
     }
     else {
         return $content;
     }
}
add_filter ('the_content', 'add_responsive_class');

Now, i need to remove the lazy load only on image with class "aligncenter size-full remove-lazy".

I try with this, after the above code, but i have an error and it doesn't work:

function remove_lazy_loading_for_specific_class( $attributes ) {
    $attributes[] = 'class="aligncenter size-full remove-lazy"';
    return $attributes;
}
add_filter( 'wp_img_tag_add_loading_attr', 'remove_lazy_loading_for_specific_class' );

How can I do that? Thanks

Sohila Khaled · Accepted Answer · 2020-12-16 14:18:33Z

0

Not sure if this would be helpful but instead of all of this why not give this image an ID or a class and remove the lazy attribute that WordPress adds by default using the removeAttribute() method.

answered Dec 16, 2020 at 14:18

Sohila Khaled

644 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

hermes_44 Over a year ago

Hi Sohila Khaled, thanks but i need to remove lazy for all first image of every posts on the site. So i need a function, because manually it would be impossible, there are so many posts :)

Sohila Khaled Over a year ago

Check this it might be helpful: wordpress.org/support/topic/excluding-the-first-post-image

hermes_44 Over a year ago

no, the code in that page is valid for the plugin "Lazy Loader". I don't use any plugins for lazy loading image, i need a solution for the default lazy loading add by wordpress :( thanks anyway

hermes_44 · Accepted Answer · 2020-12-16 15:23:11Z

I solved only with this :)

function add_responsive_class($content){
    if ( is_single() || is_page() || is_front_page() || is_home() ) {
        $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->removeAttribute( 'loading' );
            $html = $document->saveHTML();
            return $html;
        }
        
        else {
            return $content;
        }
     }
     else {
         return $content;
     }
}
add_filter ('the_content', 'add_responsive_class');

Collectives™ on Stack Overflow

Remove Lazy loading on first image in Wordpress

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related