Conflict with lazyload plugin

  • Hi!
    I applied lozad.js script to my wordpress/woocommerce frontend. Everything is working fine but not with the Ajax Search. Only the loading gif is showing and no data-loaded=”true” attribute.
    I’m also working with the “slick carousel” and there the lozad.js script works fine.
    So there must be some conflict. I tried to change the priority but without luck.
    This is the code I am using.

     if ( ! is_admin() ) {
     // Runs only if this PHP code is in a file that displays outside the admin panels, like the theme template.
     // Lazyload Converter
     function add_lazyload($content) {
         $content = mb_convert_encoding($content, 'HTML-ENTITIES', "UTF-8");
         $dom = new DOMDocument();
         @$dom->loadHTML($content);
         // Convert Images
         $images = [];
         foreach ($dom->getElementsByTagName('img') as $node) {
             $images[] = $node;
         }
         foreach ($images as $node) {
             $fallback = $node->cloneNode(true);

             $oldsrc = $node->getAttribute('src');
             $node->setAttribute('data-src', $oldsrc );
             $newsrc = 'https://d1zczzapudl1mr.cloudfront.net/preloader/loader_150x150.gif';
             $node->setAttribute('src', $newsrc);

             $oldsrcset = $node->getAttribute('srcset');
             $node->setAttribute('data-srcset', $oldsrcset );
             $newsrcset = '';
             $node->setAttribute('srcset', $newsrcset);

             $classes = $node->getAttribute('class');
             $newclasses = $classes . ' lozad';
             $node->setAttribute('class', $newclasses);

             $noscript = $dom->createElement('noscript', '');
             $node->parentNode->insertBefore($noscript, $node);
             $noscript->appendChild($fallback);
         }
         // Convert Videos
         $videos = [];
         foreach ($dom->getElementsByTagName('iframe') as $node) {
             $videos[] = $node;
         }

         foreach ($videos as $node) {
             $fallback = $node->cloneNode(true);
             $oldsrc = $node->getAttribute('src');
             $node->setAttribute('data-src', $oldsrc );
             $newsrc = '';
             $node->setAttribute('src', $newsrc);
             $classes = $node->getAttribute('class');
             $newclasses = $classes . ' lozad';
             $node->setAttribute('class', $newclasses);
             $noscript = $dom->createElement('noscript', '');
             $node->parentNode->insertBefore($noscript, $node);
             $noscript->appendChild($fallback);
         }

         $newHtml = preg_replace('/^<!DOCTYPE.+?>/', '', str_replace( array('<html>', '</html>', '<body>', '</body>'), array('', '', '', ''),
         $dom->saveHTML()));
         return $newHtml;
     }
     add_filter('the_content', 'add_lazyload', 999);
     add_filter('post_thumbnail_html', 'add_lazyload', 999);

 } else {
     // Runs only if this code is in a file that displays inside the admin panels, like a plugin file.
 }
  • The topic ‘Conflict with lazyload plugin’ is closed to new replies.