wp-lazysizes doesn't work with ACF

[dangelion]

If I use this code to print image: echo get_the_post_thumbnail( $page->ID, 'full', array('class' => 'card__image') ); the output will be:

<img width="1024" height="719" src="//localhost:3003/wp-content/uploads/2017/07/image-1024x719.jpg" data-src="//localhost:3003/wp-content/uploads/2017/07/image-1024x719.jpg" class="card__image wp-post-image lazyautosizes lazyloaded" alt="" data-sizes="auto" data-srcset="//localhost:3003/wp-content/uploads/2017/07/image-1024x719.jpg 1024w, //localhost:3003/wp-content/uploads/2017/07/image-300x211.jpg 300w, //localhost:3003/wp-content/uploads/2017/07/image-768x540.jpg 768w" sizes="390px" srcset="//localhost:3003/wp-content/uploads/2017/07/image-1024x719.jpg 1024w, //localhost:3003/wp-content/uploads/2017/07/image-300x211.jpg 300w, //localhost:3003/wp-content/uploads/2017/07/image-768x540.jpg 768w">

and the images are lazy loaded.

Instead, if I get the image from an "Image" field of ACF:

$image = get_field('pz_home_img');
$imageID = $image['ID'];
echo wp_get_attachment_image( $imageID, 'full', false, array( 
  'class' => 'lazyload', 
  'data-sizes' => 'auto' 
) );

the output will be:

<img width="1036" height="1056" src="//localhost:3000/wp-content/uploads/2017/07/image.png" class="lazyautosizes lazyloaded" alt="" data-sizes="auto" srcset="//localhost:3000/wp-content/uploads/2017/07/image.png 1036w, //localhost:3000/wp-content/uploads/2017/07/image-294x300.png 294w, //localhost:3000/wp-content/uploads/2017/07/image-768x783.png 768w, //localhost:3000/wp-content/uploads/2017/07/image-1005x1024.png 1005w" sizes="518px">

The result is that lazy loading doesn't work.

Some help?

[Sysix]

this plugin has no hook into wp_get_attachment_image. the only hook which is defined, is build with an array of HTML-Attributes.

Hook-Docs.

I Build on the fly this simple code, maybe it works for you:

public function filter_attributes($attributes)
        {
            $srcset = isset($attributes['srcset']) ? $attributes['srcset'] : null;
            $sizes = isset($attributes['sizes']) ? $attributes['sizes'] : null;
            $src = isset($attributes['src']) ? $attributes['src'] : null;
            $class = isset($attributes['class']) ? $attributes['class'] : null;

            if (strpos($class, 'lazyload') !== false) {
                return $attributes;
            }

            unset($attributes['srcset'], $attributes['sizes']);

            if (!$sizes) {
                $sizes = 'auto';
            }

            $class .= ' lazyload';

            $attributes['data-src'] = $src;
            $attributes['data-sizes'] = $sizes;
            $attributes['data-srcset'] = $srcset;
            $attributes['src'] = $this->get_placeholder_img(); // apply_filters( 'lazysizes_placeholder_image',
            'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' );
            $attributes['class'] = $class;

            return $attributes;
        }

[sermalefico]

this code cause fatal error y codesnippets