Add custom srcset + sizes values to post thumbnails? #255
Description
I'm helping test Jetpack to make sure Photon is fully compatible with 4.4's responsive images and I had a few questions that I was hoping someone could help me with. I'm not a developer, but I can usually figure things out if I have code examples.
I looked at the Twenty Sixteen theme to see how to add custom sizes attributes to post thumbnails and it worked like a charm.
function superhero_post_thumbnail_sizes_attr( $attr, $attachment, $size ) {
if ( 'home-panel' === $size ) {
$attr['sizes'] = '(min-width: 1090px) 408px, (min-width: 881px) 340px, (min-width: 728px) 408px, (min-width: 576px) 335px, (min-width: 430px) 555px, (min-width: 321px) 408px, (min-width: 320px) 300px';
}
return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'superhero_post_thumbnail_sizes_attr', 10 , 3 );
I was wondering if someone could provide me with a code example to add my own srcset attributes to a post thumbnail, using just width and height values. Is that possible? Right now I have a ton of custom image sizes for each post thumbnail, in order to account for 2x and 3x images at all the major breakpoints. Here's what one of them looks like:
add_image_size( 'home-panel', 408, 227, true );
add_image_size( 'home-panel-300', 300, 167, true );
add_image_size( 'home-panel-353', 353, 196, true );
add_image_size( 'home-panel-392', 392, 218, true );
add_image_size( 'home-panel-555', 555, 309, true );
add_image_size( 'home-panel-600', 600, 334, true );
add_image_size( 'home-panel-706', 706, 393, true );
add_image_size( 'home-panel-784', 784, 436, true );
add_image_size( 'home-panel-816', 816, 454, true );
add_image_size( 'home-panel-900', 900, 501, true );
add_image_size( 'home-panel-1059', 1059, 589, true );
add_image_size( 'home-panel-1110', 1110, 618, true );
add_image_size( 'home-panel-1176', 1176, 654, true );
add_image_size( 'home-panel-1224', 1224, 681, true );
add_image_size( 'home-panel-1665', 1665, 926, true );
That's going to to be rough on my server, so I was wondering if there's a way to just set the srcset values for a post thumbnail via the functions.php
file, just like the sizes values. It'd be awesome if Photon can hook into that so that 15+ image sizes won't have to be generated for every post thumbnail. Photon can create those image sizes on the fly.
Hopefully that all makes sense. Any guidance or code examples you can provide would be appreciated. Thank you!