Out of the box, Divi will create additional image sizes from the default Feature Image set for each article.

Images will be 400x284px. This means that depending on the original Featured Image aspect ration you might lose details on the image. 

There are two ways we can prevent that:

  1. Easy way: making sure that the original Featured Image as the same aspect ratio as the image Divi creates.
  2. Using a Child Theme and remove this default cropping functionality.

Make sure the original Featured Image as the same aspect ratio

For this method we are going to use a free app, that will help us to properly calculate our Featured Image size.

For example, if the Featured Image is 1024 x 960px we need to make sure it has the same aspect ratio as 400x284. For that we can use a free app called Aspect Ratio Calculator.

In the first two options W1 400 and for H1 enter  284 (those are the default Image size that the Blog Module will be using) in the second column for W2 enter the original image size, in this case will 1024. 

At this point the app will calculate the height of the image we need to use so that when it is displayed on the Blog Module it will show all the details, which is 727.

Finally, before uploading the image to our WordPress website we need to make sure it has 1024x727px.

This way we are 100% that the image even if it will crop it will still show all the details.

Using a Child Theme

Once the Child Theme is active in functions.php add this PHP code:

function wpc_remove_height_cropping($height) {
return '9999';
}
function wpc_remove_width_cropping($width) {
return '9999';
}

add_filter( 'et_pb_blog_image_height', 'wpc_remove_height_cropping' );
add_filter( 'et_pb_blog_image_width', 'wpc_remove_width_cropping' );

This PHP code will simply remove the default Divi Cropped Image and instead it will be using the original Image size.


Did this answer your question?