The Extra theme displays small square thumbnails in various places, such as the Posts Module. By default the images used as thumbnails are converted to a size of 150x150px. This means that any images which aren’t square will be partially cropped, either by height or width. If you’d like to prevent this cropping, you can do this by following the steps below:

1) First, add the following PHP code to your site:

// Prevent cropping of 150x150 thumbnails
function ebc_disable_cropping_of_thumbnails() {
    add_image_size('extra-image-square-small', 150, 150, false);
add_action('after_setup_theme', 'ebc_disable_cropping_of_thumbnails', 11);

As this is PHP code, you can add it to the functions.php of a child theme, or using a plugin such as Code Snippets. Please take a backup prior to adding PHP code to your site, so that you can restore the original version if necessary.

The code above maintains the 150x150px sizing of the thumbnail images (note that this may be different to the final displayed size). What it changes is the final parameter to the add_image_size function. When true, it instructs WordPress to crop the image. By setting it to false instead, WordPress will scale the image, such that the full image fits into the 150x150px size without cropping.

2) Now, download and run the Force Regenerate Thumbnails plugin. It will regenerate the existing thumbnails with the new size setting. Note that you should not need to use it for new images you upload. Once the PHP code above is in place, thumbnails of the correct size will be generated for future images you upload.

Formatting in the Posts Module

If you apply the above change you may now see a background color on your small thumbnails in the posts module. Previously this color was hidden by the thumbnails. You can get rid of this background color by adding the following CSS to your site:

.post-module .post-thumbnail {
    background-color: rgba(0, 0, 0, 0) !important;

To add the CSS code to Extra, paste it into Extra's custom CSS box, which you can find from your WordPress admin menu at "Extra > Theme Options > General > Custom CSS". Paste it after any other code already in there. Alternatively, you can place it in the style.css file of your child theme (if using).