Topic Tag: Toolset Blocks

Problem:

Customer needed to get the thumbnails in the same proportion and size without distortion

Solution:

First you need to register the size of the thumbnails inside your child theme's functions.php file and define the crop option as true, eg.:

add_image_size( 'custom-size', '360', '200', true );

Then you can register it as an option so it appears in the GUI:

add_filter( 'image_size_names_choose', 'the_custom_sizes_as_registered_by_you' );
   
function the_custom_sizes_as_registered_by_you( $sizes ) {
    return array_merge( $sizes, array(
        'custom-size' => __( 'Custom Size' ),       
    ) );
}

Now whenever you pick your sizes using blocks, in the Image Settings, the custom size you created should be available in there and with the crop option enabled by default:

Relevant Documentation:

https://developer.wordpress.org/reference/hooks/image_size_names_choose/
https://developer.wordpress.org/reference/functions/add_image_size/