Home › Forums › Front-end Issues › WordPress 4.4 responsive images › Reply To: WordPress 4.4 responsive images
I was wondering about something on your solution.. The Lazysizes plugin uses data-srcset to lazy load the images. Since wordpress uses normal srcset, the images are not lazyloaded here. I’m using your code with lazysizes, but my network inspector shows all images are loaded at once. The images are responsive, but are not lazyloaded.
Is there a way to fix this? would there be a way to string replace the srcset with data-srcset, or is that a bad thing?
I am using:
<?php $image = get_field('front_page_image'); $imageID = $image['ID']; echo wp_get_attachment_image( $imageID, 'full', false, array( 'class' => 'lazyload image-100p', 'data-sizes' => 'auto' ) ); ?>
Which outputs in:
<img width="3000" height="1931" src="http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/prent2.jpg" class="image-100p lazyautosizes lazyloaded" alt="prent2" data-sizes="auto" srcset="http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/prent2.jpg 3000w, http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/prent2-300x193.jpg 300w, http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/prent2-768x494.jpg 768w, http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/prent2-1024x659.jpg 1024w, http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/[email protected] 600w, http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/[email protected] 1536w, http://localhost:8888/coeur_catering/wp-content/uploads/2016/05/[email protected] 2048w" sizes="440px">
dont mind the @2x, as i’m using the wp-retina plugin.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
The most recent ACF Chat Friday featured a live demo of how to register CPTs directly in the plugin, one of our most requested features. Check out the summary below for a replay of the demo, and don’t forget to register for the next session! https://t.co/k2KQ3WWBAz— Advanced Custom Fields (@wp_acf) March 9, 2023
© 2023 Advanced Custom Fields.