All Collections
FAQ's and Troubleshooting
How to Prevent Gallery Images from Being Cropped
How to Prevent Gallery Images from Being Cropped

Learn how to disable the default cropping functionality from the Gallery module, and use the full-size of the images.

Marius avatar
Written by Marius
Updated over a week ago

Images displayed inside the Gallery module are designed to be cropped to a fixed size of 400x284px. This is required to ensure that no matter the original size of the image, it is always displayed the same size, especially when the Grid layout is being used.

For each uploaded image, WordPress creates a unique size image upload to be used in various places.

Remove the default cropping using a Child Theme

  1. Using the hosting File Manager app or the Advanced File Manager plugin, navigate to the wp-content/theme/your-child-theme folder

  2. Open the functions.php file

  3. Add this PHP code:

    function custom_image_width($width) {
    return '9999';
    }
    function custom_image_height($height) {
    return '9999';
    }
    add_image_size( 'custom-image-size', 9999, 9999, array( 'center', 'center' ) );
    add_filter( 'et_pb_gallery_image_width', 'custom_image_width' );
    add_filter( 'et_pb_gallery_image_height', 'custom_image_height' );

Important Note: The PHP code will remove the default cropping functionality, and the images displayed by the Gallery Image size will be the original size of each image, which might change the layout of the Gallery module, especially if the images used are not the same size.

Remove the default cropping using a third-party plugin

  1. Go to WordPress Dashboard β†’ Plugins β†’ Add New

  2. Search for Code Snippets

  3. Install and Activate the Code Snippets plugin

  4. Go to WordPress Dashboard β†’ Snippets

  5. Create a new PHP snippet

  6. Give it a name and paste the following PHP code:

    function custom_image_width($width) {
    return '9999';
    }
    function custom_image_height($height) {
    return '9999';
    }
    add_image_size( 'custom-image-size', 9999, 9999, array( 'center', 'center' ) );
    add_filter( 'et_pb_gallery_image_width', 'custom_image_width' );
    add_filter( 'et_pb_gallery_image_height', 'custom_image_height' );

Notes:

  • You can change the 9999 value to the value you want for width and height.

  • In some cases, after adding the above PHP code you might have to regenerate all the Thumbnails. Install and activate the Regenerate Thumbnails plugin.

Did this answer your question?