Using srcsets to load different images based on browser widths

by

I want it so that on a mobile breakpoint, the image in my function uses ‘full’ and on laptop/desktop it uses ‘thumbnail’.

Here’s a snippet of what I’ve got going on:

while ($sponsors->have_posts()) : $sponsors->the_post();
   $id = $sponsors->post->ID;
   $thumb_id = get_post_thumbnail_id( $id );
   $img = get_the_post_thumbnail_url( $id ); // , 'full'
   $src_set = wp_get_attachment_image_srcset( $thumb_id );

   $html_out="";
   $html_out .= '<img src="' . $img . '" srcset="' . $src_set . '" />';
endwhile;

The srcset appears empty though, not sure how to properly use this.

EDIT:
I’ve also tried doing it with
$src = wp_get_attachment_image_url( $thumb_id ); instead of $img, which also produces the same url, but wp_get_attachment_image_srcset still returns false.

0

Leave a Comment