How to Disable WordPress Automatically Generated Images – Complete Guide
As you may know, WordPress creates numerous copies of all images uploaded via the WP Media Library. These additional images are generated in various sizes, depending on your settings and other factors. This may be totally fine in general, but if you are working with lots of images on your site, the extra files can really eat up your disk space. This can be wasteful, specially if your site does not make use of all the extra images. So to help you conserve resources, eliminate waste, and keep things running as light as possible, this guide spells out everything you need to disable (or customize) all WordPress automatically generated images.
Learn how to disable any/all of WordPress’ auto-generated images to dial in the perfect configuration for your site.
Contents
- First an example..
- Do the math..
- But wait there’s more..
- Solution: Disable unwanted image sizes
- Shut them all down!
- Wrap it up..
First an example..
To get a better idea of what’s happening and why it’s important, consider my personal found-images site, eChunks.com. This site is where I like to post weird/inspiring/found images. As of now, there have been over 800 images uploaded to the site via the WP Media Library. So if I hadn’t taken measures to stop WordPress from auto-generating multiple copies of each image, that number of 800 would be more like thousands of images.
Do the math..
So running with the eChunks.com example, let’s do some quick math. We have a WordPress site with 800 original images, each averaging around 2MB in size. So collectively the original 800 images weigh around 1,600 MB or about 1.6 GB. Now let’s let WordPress do its thang and create extra copies of each image in various sizes. As of version 5.3, WordPress creates the following extra images for every image that is uploaded via the Media Library (and/or Visual Editor):
Image Size | Dimensions |
---|---|
Thumbnail | (Size based on Media settings) |
Medium | (Size based on Media settings) |
Large | (Size based on Media settings) |
Medium Large | 768px |
2x Medium Large | 1536px |
2x Large | 2048px |
Scaled | 2560px |
Okay so now to get an idea of actual file-sizes for all these generated images, let’s consider the average case where each of the 800 original images weighs around 1.5MB to 2MB. The results would look something similar to this:
Image Size | Dimensions | File Size | Total |
---|---|---|---|
Thumbnail | (Size based on Media settings) | 10KB | 8MB |
Medium | (Size based on Media settings) | 20KB | 16MB |
Large | (Size based on Media settings) | 100KB | 80MB |
Medium Large | 768px | 50KB | 40MB |
2x Medium Large | 1536px | 200KB | 160MB |
2x Large | 2048px | 400KB | 320MB |
Scaled | 2560px | 500KB | 400MB |
Adding that right column gives a grand total of 1024MB or 1.024 Gigabytes! Considering that the entire WordPress core weighs in at less than 50MB, along with a bunch of plugins and themes is still gonna be less than a couple hundred megabytes. So relative to the entire website, the amount of disk space required by all of those extra images is considerable to put it mildly.
And that’s for a typical site with only 800 images; some sites make use of a LOT more than that, not to mention high-resolution images and images that weigh a lot more than the average numbers used in the previous calculations. So it’s easy to understand, if WordPress generated images are not kept in check, the amount of required disk space can really add up.
But wait there’s more..
So far we’ve got WordPress generating seven additional images for each original uploaded image. But that’s not all of the extra images that may be in play. Depending on your theme, even more additional image sizes may be created via the following WordPress core functions:
- set_post_thumbnail_size() — Creates a custom size for Featured Images
- add_image_size() — Creates extra images of any specified size(s)
For example the WordPress default theme named “Twenty Fifteen” adds another extra generated image with this line:
set_post_thumbnail_size( 825, 510, true );
So that one extra image, plus the seven other default generated images, plus the original uploaded image, all looks like this on the server:
To summarize: WordPress generates at least 7 extra image sizes for each uploaded image. And then depending on your theme and plugins, any number of additional image sizes may be created as well. For some sites, this is useful or no big deal; for other sites, it’s something that’s completely unnecessary at best, wasteful overkill at worst.
Solution: Disable unwanted image sizes
The above scenario is only one example to illustrate the point. The sum total of image weight could be (much) more or less depending on your images, media settings, theme functions, and so forth. Fortunately, I continually disable the new WordPress image sizes that are added over the years, so I’ve been able to avoid massive disk bloat on my own sites.
So what’s the solution? How to manage all those extra images and conserve disk space? The trick is understanding how to disable each of the extra image sizes, so you can add the required code to disable (or customize) the ones that are not needed. Here are the magic recipes for controlling them:
- Disable Thumbnail Size
- Disable Medium Size
- Disable Large Size
- Disable Medium Large
- Disable 2x Medium Large
- Disable 2x Large
- Disable Scaled
- Disable Other Sizes
Disable Thumbnail Size
To disable generation of thumbnail-size images, set the “Thumbnail size” option to “0” (under Settings > Media > Image sizes). Setting to “0” disables auto-generation of this size image. Set to any other value to customize the size instead of disabling. Here is what the setting looks like under the Settings menu in the WP Admin Area:
Alternately, if you prefer to disable the thumbnail-size images programmatically, you can add the following code snippet to your theme functions.php
(or add via simple/custom plugin):
function shapeSpace_disable_thumbnail_images($sizes) {
unset($sizes['thumbnail']); // disable thumbnail size
return $sizes;
}
add_action('intermediate_image_sizes_advanced', 'shapeSpace_disable_thumbnail_images');
Disable Medium Size
To disable generation of medium-size images, set the “Medium size” option to “0” (under Settings > Media > Image sizes). Setting to “0” disables auto-generation of this size image. Set to any other value to customize the size instead of disabling.
Alternately, if you prefer to disable the medium-size images programmatically, you can add the following code snippet to your theme functions.php
(or add via simple/custom plugin):
function shapeSpace_disable_medium_images($sizes) {
unset($sizes['medium']); // disable medium size
return $sizes;
}
add_action('intermediate_image_sizes_advanced', 'shapeSpace_disable_medium_images');
Disable Large Size
To disable generation of large-size images, set the “Large size” option to “0” (under Settings > Media > Image sizes). Setting to “0” disables auto-generation of this size image. Set to any other value to customize the size instead of disabling.
Alternately, if you prefer to disable the large-size images programmatically, you can add the following code snippet to your theme functions.php
(or add via simple/custom plugin):
function shapeSpace_disable_large_images($sizes) {
unset($sizes['large']); // disable large size
return $sizes;
}
add_action('intermediate_image_sizes_advanced', 'shapeSpace_disable_large_images');
Disable Medium Large
To disable the “Medium Large” size images, add the following code snippet to your theme’s functions.php
file:
function shapeSpace_disable_medium_large_images($sizes) {
unset($sizes['medium_large']); // disable 768px size images
return $sizes;
}
add_filter('intermediate_image_sizes_advanced', 'shapeSpace_disable_medium_large_images');
Disable 2x Medium Large
To disable the “2x Medium Large” size images, add the following code snippet to your theme’s functions.php
file:
function shapeSpace_disable_2x_medium_large_images($sizes) {
unset($sizes['1536x1536']); // disable 2x medium-large size
return $sizes;
}
add_filter('intermediate_image_sizes_advanced', 'shapeSpace_disable_2x_medium_large_images');
Disable 2x Large
To disable the “2x Large” size images, add the following code snippet to your theme’s functions.php
file:
function shapeSpace_disable_2x_large_images($sizes) {
unset($sizes['2048x2048']); // disable 2x large size
return $sizes;
}
add_filter('intermediate_image_sizes_advanced', 'shapeSpace_disable_2x_large_images');
Disable Scaled
To disable the “Scaled” images, add the following code snippet to your theme’s functions.php
file:
add_filter('big_image_size_threshold', '__return_false');
Disable Other Sizes
For any extra images generated via set_post_thumbnail_size()
and add_image_size()
, you can use remove_image_size()
. Here is an example:
function shapeSpace_disable_other_images() {
remove_image_size('post-thumbnail'); // disable set_post_thumbnail_size()
remove_image_size('another-size'); // disable other add image sizes
}
add_action('init', 'shapeSpace_disable_other_images');
The key here is to know the name/slug of the custom image sizes you want to remove. For set post thumbnail (i.e., Featured Image), it’s always post-thumbnail
. For other images added via add image size, the slug name will vary depending on your theme or plugin (whichever is responsible for adding the extra sizes). So to implement, first check your uploads directory and/or theme functions file to determine which sizes are being generated. Some themes add a bunch of extra image sizes, others do not, it just depends on the theme.
Shut them all down!
Before our parting shot, here is an “all-in-one” code snippet that combines and streamlines all of the above techniques into a single, plug-&-play code snippet:
// disable generated image sizes
function shapeSpace_disable_image_sizes($sizes) {
unset($sizes['thumbnail']); // disable thumbnail size
unset($sizes['medium']); // disable medium size
unset($sizes['large']); // disable large size
unset($sizes['medium_large']); // disable medium-large size
unset($sizes['1536x1536']); // disable 2x medium-large size
unset($sizes['2048x2048']); // disable 2x large size
return $sizes;
}
add_action('intermediate_image_sizes_advanced', 'shapeSpace_disable_image_sizes');
// disable scaled image size
add_filter('big_image_size_threshold', '__return_false');
// disable other image sizes
function shapeSpace_disable_other_image_sizes() {
remove_image_size('post-thumbnail'); // disable images added via set_post_thumbnail_size()
remove_image_size('another-size'); // disable any other added image sizes
}
add_action('init', 'shapeSpace_disable_other_image_sizes');
That code snippet combines all of the techniques required to disable all of WordPress generated images (leaving only the original uploaded image). The only editing that may be required is for that last function, where “other” image sizes are disabled; there you may want to edit the another-size
slug to match any other sizes that you want to disable, or if there are no other sizes, simply comment out or remove the line.
Wrap it up..
Granted, controlling WordPress image sizes may be more important for sites with a lot of images. But even if your site only uploads a few images every now and then, keeping your files as simple and lightweight as possible makes for a leaner, faster, more optimized WordPress-powered website.
from Perishable Press https://ift.tt/34Ng26o
Comments
Post a Comment