Prevent WordPress from Generating Unnecessary Image Sizes

WordPress
1

When you upload an image to your WordPress media library, the platform automatically generates multiple resized versions of that image. If your website doesn’t need these extra image sizes, they can waste valuable storage and increase the size of your server backups.

In this guide, I’ll explain WordPress’s default image sizes, the reasons behind their generation, how to identify extra image sizes, and the code snippets to prevent WordPress from creating image sizes that are not needed.

Prevent WordPress from Creating Extra Image Sizes

The most effective method to prevent WordPress from creating unnecessary cropped images involves a bit of code.

Step 1: Add the following snippet to your theme’s functions.php file or via a code snippets plugin.

// Return an empty list of image sizes to generate on upload
add_filter( 'intermediate_image_sizes_advanced', '__return_empty_array' );

// Return false for calculated resized image dimensions
add_filter( 'image_resize_dimensions', '__return_false' );

This code works by hooking into the intermediate_image_sizes_advanced filter, which returns an array of image sizes generated automatically during image uploads. By returning an empty array, WordPress knows not to generate extra images. Additionally, we hook into image_resize_dimensions in case a theme or plugin uses its own “on-the-fly” cropping solution.

WordPress Media Settings Admin Panel

Step 1: Navigate to Settings > Media in your WordPress admin area.

Step 2: Set the width and height of the Thumbnail, Medium, and Large image sizes to 0.

Setting the width and height of all fields to 0 will prevent WordPress from creating those extra images.

Disable the Big Image Size Threshold

Step 1: Add the following code snippet to your theme’s functions.php file or a code snippets plugin:

// Disable the big image size threshold
add_filter( 'big_image_size_threshold', '__return_false' );

Caution: The big image threshold exists for a reason. Disabling this feature could cause performance issues on the server.

Modify the Big Image Size Threshold

Step 1: Use the following code snippet in your theme’s functions.php file or a code snippets plugin to adjust the threshold:

// Modify the big image size threshold
add_filter( 'big_image_size_threshold', function( $threshold ) {
    return 5000;
} );

This example changes the threshold value from 2560 to 5000.

How to Check What Image Sizes are Defined on Your Site

WordPress lacks a built-in method to view all registered image sizes. Here are some code-based solutions.

Display Registered Image Sizes in the WP Admin

Step 1: Add the following code to your theme’s functions.php file or via a code snippets plugin.

// Add a table of image sizes to the Settings > Media admin page
add_action( 'admin_init', function() {
	add_settings_section(
		'dummy_registered_image_sizes_info',
		esc_html__( 'Registered Image Sizes', 'text_domain' ),
		function() {
			echo '<table class="wp-list-table widefat fixed striped">';
			echo '<thead><tr><th>' . esc_html__( 'Name', 'text_domain' ) . '</th><th>' . esc_html__( 'Dimensions', 'text_domain' ) . '</th></tr></thead>';
			foreach ( (array) wp_get_registered_image_subsizes() as $size => $dims ) {
				if ( ! in_array( $size, [ 'thumbnail', 'medium', 'large' ], true ) ) {
					$width = $dims['width'] ?? 0;
					$height = $dims['height'] ?? 0;
					echo "<tr><td><strong>{$size}</strong></td><td>{$width}x{$height}</td>";
				}
			}
			echo '</table>';
		},
		'media'
	);
}, PHP_INT_MAX );

This code snippet will display a table of all defined image sizes at the bottom of the Settings > Media panel.

Quick Method

Step 1: Insert the following code into your functions.php file.

Step 2: Refresh your website to display a list of the registered image sizes.

Step 3: Copy the list into a text file.

Step 4: Remove the code from functions.php.

// Display all defined image sizes at the top of the site inside a <pre> tag
add_action( 'wp_head', function() {
	echo '<pre>';
	foreach ( (array) wp_get_registered_image_subsizes() as $size => $dims ) {
		$width = $dims['width'] ?? 0;
		$height = $dims['height'] ?? 0;
		echo "{$size}: {$width}x{$height}\n";
	}
	echo '</pre>';
} );

Exclude Specific Image Sizes from Being Created on Upload

Step 1: Add the following snippet to your theme’s functions.php file:

// Exclude certain image sizes from being generated on upload
add_filter( 'intermediate_image_sizes_advanced', function( $sizes ) {
	$sizes_to_exclude = [
		'thumbnail',
		'medium',
		'large',
		'medium_large',
		'1536×1536',
		'2048×2048',
	];
	foreach ( $sizes_to_exclude as $size_to_exclude ) {
		unset( $sizes[ $size_to_exclude ] );
	}
    return $sizes;
} );

Why are Extra Resized Images Created

WordPress generates alternative image sizes for several reasons:

  • Faster Loading Times: Smaller images load faster.

  • Responsive Images: To cater to different screen sizes.

  • Consistency: Ensures uniform appearance of featured images.

  • High-Resolution Displays: For optimal viewing on retina displays.

  • Featured Thumbnails: Provide alternative image sizes for use in different parts of the site or with theme/plugins specific elements.

  • Server Performance: To reduce the load on the server when displaying images.

Default Image Sizes in WordPress

Here is a list of default image sizes in WordPress:

Name Default Size Description
thumbnail 150x150 User defined thumbnail size.
medium 300x300 User defined medium size.
medium_large 768x0 For responsive and HDPI displays.
large 1024x1024 User defined large size.
1536x1536 1536x1536 For retina/HDPI displays.
2048x2048 2048x2048 For larger, high-resolution displays.
-scaled ~2560 When the original image uploaded is larger than the big image size threshold, WordPress creates this scaled version.
full – Largest possible size. Original or scaled image.

Image Sizes Created by Your WordPress Theme and Plugins

Many classic WordPress themes (non-block themes) register their own image sizes, and plugins may also register new image sizes for displaying posts or custom post types. Check the documentation for your theme and plugins to ensure they’re not creating unnecessary resized versions of your images.

The Big Image Size Threshold in WordPress

WordPress 5.3 introduced the Big Image Size Threshold. This threshold defines the maximum width or height of an image before WordPress generates additional sizes upon upload. The default value is 2560. Images exceeding this threshold are scaled down, and additional sizes are generated from the scaled version.

Tips for Reducing the Need for Resized Images

If you’re planning to disable extra image sizes, consider these tips:

  • Don’t Upload Massive Images: Avoid uploading excessively large images. If unavoidable, keep the big image threshold enabled.

  • Upload Big Enough Images: Ensure images are large enough for high-resolution screens but optimized for loading speed.

  • Optimize Images Prior to Upload: Use tools like tinypng.com to optimize and convert images to WebP format before uploading.

  • Use Image Aspect Ratios: Utilize the CSS aspect-ratio property for consistent image display.

How to Remove Old Image Sizes from Your Server

The code to prevent extra image sizes only affects new uploads. To clean up old cropped images, use the Force Regenerate Thumbnails plugin. Enable it, run the process, and then delete the plugin. Always back up your site before performing such actions.

Disabling extra image sizes can optimize server space and backup sizes.