How to disable WordPress cropping image modules

Default threshold to scale down over sized images is 2560px, FWIW. You can alter this but you cannot disable it. Of course, if you change it to be much larger, it effectively disables the the scaling down of big images. Use the ‘big_image_size_threshold’ filter to alter the size. I recommend using a sane value, just in case someone tries to upload a 36 MPX image. No one wants that large of an image on a web page.

Note that this is a scaling threshold to make over sized images less large as their “full” size. This scaling does not crop images. Whether sub-sizes like thumbnail or medium are cropped or not is part of their size definition. You can choose to crop thumbnails or not in image settings. The other default sizes are always scaled. If you have an image size besides thumbnail that is cropped, it is a size added by your theme or a plugin. There might be a way to specify scaling instead of cropping, it depends on the theme or plugin responsible.

It would be possible to add your own custom image size that is always scaled and never copped. Then always use this size instead of whichever one you find objectionable due to cropping.

Good to know, thank you! I use Divi Builder, how can I change the custom image size to largest edge is 1500px? Is there a code I can add to my child theme or disable the size added by the theme? I don’t want the images to be larger than this for site performance.

Whenever I scale down my images to 1500px, then it does the weird cropping thing and I don’t want that to happen.

You can use remove_image_size() to remove unwanted sizes added by themes and plugins. You do need to know what the size name is that you want to remove. You could var_dump the global $_wp_additional_image_sizes array to see what has been registered.

This function does need to be called after the theme adds its sizes. To help ensure this happens, use a larger $priority arg when adding your callback that makes the call. For example, near the bottom of the linked doc page, refer to the user contributed example by “Codex” that removes the size ‘image-name’. Where it adds its callback, modify like this:
add_action('init', 'wpdocs_remove_plugin_image_sizes', 9999 );
The 9999 helps ensure the theme size has already been added prior to remo.

Removing a registered size only affects new uploads, previously uploaded sizes will remain. To remove those sizes from the server, there are plugins available that will regenerate image sizes.

Use the ‘big_image_size_threshold’ filter to limit the max. usable size to 1500px. Once in place, newly uploaded images over this size will be scaled (not cropped) down to 1500px. To use a 1500px scaled image, select the “full” size when inserting images. IMO, since there are a lot of 1920px monitors, 1920px may be more reasonable than 1500px. You can always select a smaller size where appropriate. Having a 1920px image means if you link an inserted image to its full size media file, it’ll actually be full size on a 1920px monitor.

Thank you, this is really insightful and helpful. However, it is a bit confusing only because I would say I am a 3 on a scale of 1-10 on backend WordPress/coding knowledge. Would you be able to provide a step by step on how to do what you just explained?

In a child theme’s functions.php or a plugin’s main file add this:

function ca_remove_plugin_image_sizes() {
        global $_wp_additional_image_sizes;
        var_dump( $_wp_additional_image_sizes );
	//remove_image_size('image_name');
}
add_action('init', 'ca_remove_plugin_image_sizes', 9999 );

function ca_big_image_size_threshold( $threshold ) {
	return 1500; // new threshold
}
add_filter('big_image_size_threshold', 'ca_big_image_size_threshold', 9999 );

The var_dump output will appear at the top of any WP page, but it’ll be a little hard to read. If you view the page’s HTML source (Ctrl/Cmd+U in most browsers) it’ll be formatted better. Determine what size you want to remove from the array’s key names. Use this name in place of ‘image_name’ in the commented line to remove_image_size(). Un-comment that line and comment out the global and var_dump() lines.

To test (which I did not do), upload an over sized image; then see what image files WP generates from it in /uploads/.

This is what comes up on the top of the page when I view the HTML. Where would the size name be? https://ibb.co/r7ryK0T

The output is not there. You should see something like:

array(3) {
  ["1536x1536"]=>
  array(3) {
    ["width"]=>
    int(1536)
    ["height"]=>
    int(1536)
    ["crop"]=>
    bool(false)
  }
  ["2048x2048"]=>
  array(3) {
    ["width"]=>
    int(2048)
    ["height"]=>
    int(2048)
    ["crop"]=>
    bool(false)
  }
  ["post-thumbnail"]=>
  array(3) {
    ["width"]=>
    int(1568)
    ["height"]=>
    int(9999)
    ["crop"]=>
    bool(false)
  }
}
<!doctype html>
<html lang="en-US" >
<head>
etc.....

The image size names are the main array’s key names. Names might be either a given name or a dimensional pair.

I have since tested the first part of the code, it does work for me. The above example is my site’s actual added image sizes. Where did you place the code? Any errors logged from recent code changes? Is any caching in place such that you’re seeing stale page content?

I think we’re almost there! I input the code in the child’s theme and this is what showed up:

array(12) {
  ["1536x1536"]=>
  array(3) {
    ["width"]=>
    int(1536)
    ["height"]=>
    int(1536)
    ["crop"]=>
    bool(false)
  }
  ["2048x2048"]=>
  array(3) {
    ["width"]=>
    int(2048)
    ["height"]=>
    int(2048)
    ["crop"]=>
    bool(false)
  }
  ["et-pb-post-main-image"]=>
  array(3) {
    ["width"]=>
    int(400)
    ["height"]=>
    int(250)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-post-main-image-fullwidth"]=>
  array(3) {
    ["width"]=>
    int(1080)
    ["height"]=>
    int(675)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-portfolio-image"]=>
  array(3) {
    ["width"]=>
    int(400)
    ["height"]=>
    int(284)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-portfolio-module-image"]=>
  array(3) {
    ["width"]=>
    int(510)
    ["height"]=>
    int(382)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-portfolio-image-single"]=>
  array(3) {
    ["width"]=>
    int(1080)
    ["height"]=>
    int(9999)
    ["crop"]=>
    bool(false)
  }
  ["et-pb-gallery-module-image-portrait"]=>
  array(3) {
    ["width"]=>
    int(400)
    ["height"]=>
    int(516)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-post-main-image-fullwidth-large"]=>
  array(3) {
    ["width"]=>
    int(2880)
    ["height"]=>
    int(1800)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-image--responsive--desktop"]=>
  array(3) {
    ["width"]=>
    int(1280)
    ["height"]=>
    int(720)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-image--responsive--tablet"]=>
  array(3) {
    ["width"]=>
    int(980)
    ["height"]=>
    int(551)
    ["crop"]=>
    bool(true)
  }
  ["et-pb-image--responsive--phone"]=>
  array(3) {
    ["width"]=>
    int(480)
    ["height"]=>
    int(270)
    ["crop"]=>
    bool(true)
  }

I believe the one I want to change is this one, correct?

  }
  ["et-pb-image--responsive--desktop"]=>
  array(3) {
    ["width"]=>
    int(1280)
    ["height"]=>
    int(720)
    ["crop"]=>
    bool(true)
  }

If so, this is what I input for the new code in the child theme. However, it’s giving me this error “Something went wrong. Your change may not have been saved. Please try again. There is also a chance that you may need to manually fix and upload the file over https://FTP.”

Did I forget to change the name in one of the lines, or what do you mean by un-comment/comment on lines?

function ca_remove_plugin_image_sizes() {

////remove_image_size('et-pb-image--responsive--desktop');
}
add_action('init', 'ca_remove_plugin_image_sizes', 9999 );

function ca_big_image_size_threshold( $threshold ) {
	return 1500; // new threshold
}
add_filter('big_image_size_threshold', 'ca_big_image_size_threshold', 9999 );

• This reply was modified 1 year, 8 months ago by christinealmendras.

Nevermind, I fixed the code and it works now. Thank you so much!!!!!