@tmconnect thank you for your image field code. I’m new to the responsive images + ACF + WordPress party, so it’s been really useful.
Following the Responsive Images Done Right post, this is what I wanted to achieve:
<img srcset="computer-area-1440x810.jpg 1440w 2x,
computer-area-720x405.jpg 720w,
computer-area-480x270.jpg"
sizes ="(min-width: 45em) 63.1vw",
100vw"
src="computer-area-480x270.jpg"
alt="Computer area">
And this is what I cobbled together, using your code as starting point:
<img srcset="<?php echo $img_srcset; ?>"
sizes="(min-width: 45em) 63.1vw",
100vw"
src="<?php echo $image['sizes']['small']; ?>"
alt="<?php echo $image['alt']; ?>">
And this is what is output:
<img srcset="http://ysgoltrewen.dev/app/uploads/2016/03/computer-area.jpg 1920w, http://ysgoltrewen.dev/app/uploads/2016/03/computer-area-720x405.jpg 720w, http://ysgoltrewen.dev/app/uploads/2016/03/computer-area-1440x810.jpg 1440w, http://ysgoltrewen.dev/app/uploads/2016/03/computer-area-480x270.jpg 480w"
sizes="(min-width: 45em) 63.1vw,
100vw"
src="http://ysgoltrewen.dev/app/uploads/2016/03/computer-area-480x270.jpg"
alt="Computer area.">
It kind of seems to work! Sorry for verbosity but wanted to get it out there to see if this is the right path (though I know it’s a simple use-case and that there’s no device-pixel-ratio in the srcset).
