I don’t understand how to customize responsive sizes images in WP 4.4.1.
The only available hooks that I see are wp_calculate_image_srcset and wp_calculate_image_sizes, and neither has the named image size that was asked for as a parameter. So that would mean that you can correct image sizes, but with no knowledge of the context?

One simple case, with one banner and 3 image sizes :

  • Mobile (780×200)
  • Tablet (980×250)
  • “Desktop” (1600×300).

What I want is to be able to tell WP core that I want those dimensions at width w1, w2 and w3 (which would be here 0-780, 781-980 and 981+), or that I want the named image size mobile for w1, tablet for w2 and desktop for w3.

Anyone have a clue?

1 Answer
1

I handle the context like this:

function wpse_216001_srcset() {
    // generate your Srcset here and return 
}
function wpse_216001_sizes() {
    // generate your sizes attribute here and return
}

add_filter( 'wp_calculate_image_sizes', 'wpse_216001_sizes', 10 , 2 );
add_filter( 'wp_calculate_image_srcset', 'wpse_216001_srcset', 10 , 5);

// call one of the standard WP image output functions here

remove_filter( 'wp_calculate_image_sizes', 'wpse_216001_sizes', 10 );
remove_filter( 'wp_calculate_image_srcset', 'wpse_216001_srcset', 10 );

You can either do this in your template or make a wrapper function in your functions.php and then call this as a template tag.

Leave a Reply

Your email address will not be published. Required fields are marked *