Envira Gallery Blog
Digital Photography Tips, Tutorials and Resources
How to Get Around the New WordPress Image Compression Settings
Last updated on Sep 27, 2021 by Waseem Abbas Reader Disclosure
Want to know how to get around the default image compression settings in WordPress? When WordPress 4.5 was released, the compression setting was changed from 90 to 82, resulting in lower file sizes (and lower quality). In this article, we will share how to get around the new WordPress image compression settings.
Changes to WordPress Image Compression
In WordPress 4.5, there is a major decrease in the file size of photos resized by WordPress.
By default, WordPress now compresses images to 82% for increased page load speed, especially on mobile devices. Better performance is a good thing, but it can also be a bad thing if your images come out looking lower quality than you want. (You can learn about the compression changes here.)
If you are concerned about page speed and your image quality, we recommend that you check out these image optimization tools for image compression so that you have more control over how much or how little your images are compressed.
We should note that you can avoid the WordPress image compression settings simply by editing your photos in Photoshop before uploading them to WordPress. However, you may enjoy the convenience of editing your photos directly inside WordPress, and you may not want to install yet another plugin to do the job.
In that case, we have a simple solution for you.
Let’s get into the steps of how to get around the new WordPress image compression settings…
How to Disable WordPress Image Compression
If you want to completely retain the quality of your images after resizing them in WordPress, you can simply disable image compression.
To disable it, you’ll need to add the below code into the function.php file of your theme:
add_filter('jpeg_quality', function($arg){return 100;});The ‘return’ value of 100 ensures that WordPress will keep the original quality of the image.
How to Decrease or Increase Image Compression in WordPress
If you want to keep some amount of compression, you can simply reduce the return value. To go back to the way WordPress was before version 4.5, set the return value to 90:
add_filter('jpeg_quality', function($arg){return 90;});Or, you can set the return value to 75 and increase the compression even more:
add_filter('jpeg_quality', function($arg){return 75;});After inserting this code into your function.php file, you’ll need to regenerate your thumbnails before you will see the effect of your custom WordPress image compression settings. (You can easily regenerate thumbnails with the Regenerate Thumbnails plugin.)
We hope this article has helped you to learn how to get around the new WordPress image compression settings. You may also want to check out our guide on how to add fullscreen image galleries in WordPress.
Speed Up Your Website with Envira Gallery’s Compression Tool
The Compression Tool directly inside Envira Gallery lets you to optimize your images and reduce their file sizes.
The image compression tool is available for users with any paid Envira Gallery subscription (Pro tier or higher).
If you’re using Envira Gallery Lite, head over to our documentation to learn more about upgrading your Envira Gallery license.
If you’ve already upgraded, you’ll just need to update the Envira Gallery plugin before you can begin compressing your images.
Learn how to set up the new Compression Tool inside Envira Gallery so that you can speed up your website and page loading times.
Using WordPress and want to get Envira Gallery free?
Envira Gallery helps photographers create beautiful photo and video galleries in just a few clicks so that they can showcase and sell their work.
Related Posts
Hi Waseem, thanks for the advice! I’m a bit lost because of conflicting info about which code to use to disable image compression and its relevance to the current WordPress version. I understand the advice in this article was written during 2016, which is about 2 years ago, so I’m wondering if the code this article recommends will still work in the current WordPress version.
Also, can you please explain the difference between the code recommended in this post compared with the code versions below?
Thanks so much for any advice you can give!
Code 1
add_filter(‘jpeg_quality’, function($arg){return 100;});
Code 2
add_filter( ‘jpeg_quality’, create_function( ”, ‘return 100;’ ) );
Code 3
add_filter(‘jpeg_quality’, function($arg){return 100;});
add_filter( ‘wp_editor_set_quality’, function($arg){return 100;} );
Hey Julian, the “return 100” will disable the image compression and display the images in original condition. However, you can decrease the value to “90”, “80” or less to display compressed images in WordPress. The code is relevant with the current version of WordPress. 🙂
Hi, do you know if there is a way to compress more some images and don’t compress others?
Like, let’s assume I have this:
add_image_size( ‘etimue2018-cantina-size’, 64, 64, array( ‘right’, ‘bottom’ ) );
and I would like to use something like lazyload, I’ll need 2 versions of this image:
1 with low res for pre-loading and the one with ‘good res’ for loaded image.
With the code you gave us (Thank you by the way) we are able to modify all the images compression, is there a way to do it for only 1 particular size?
Thank you.
Hi Marco, Unfortunately, no there isn’t really. When you set up a compressing function for images, there’s no way that I know of to only target some. It would be blanket coverage. Anything like that is really customization and is outside the scope of support. Sorry I can’t be of more assistance.
I’m having an issue where I have changed the compressions settings to 100% so my thumbnails look sharp while my gallery is still compressed. Is there a way to correct?
There are a few things that might be going on here. I’d suggest reaching out to support directly. They’ll definitely be able to help you troubleshoot!
I’m confused about WHEN wordpress compresses images… Is it during the upload, while in the media library, when it’s inserted to a page, when the page is loaded each time?
I’ve been experimenting with a few “disable image compression” plugins, and none of them seem to have any effect on my image quality. I’m wondering if the plugins have to be enabled before I upload them, insert them into a page or what?
I am confused too. I never thought WordPress compress images by default. So the question is when does WordPress compress these photos? Is it during the upload?
Is there any way to do this using CSS?
Is there anyone who found the solution? My new site just looked bad due to high compression. Seems like when I upload the image in Media, the compression takes place.
Good day, I am having some problems with the WordPress crunching all my images which really slows down the process of uploading images. Is there any way of removing the Flash Uploader. I have already added the following code to all the function.php files in my Cpanel:
add_filter( ‘flash_uploader’, create_function( ‘$a’, “return null;” ), 1 );
as well as
add_filter( ‘flash_uploader’, create_function( ‘$a’, “return false;” ), 1 );
I have also changed the media settings Image sizes all to 0.
Nothing seems to be working it keeps crunching the images when I upload it.
If anyone can help I will really appreciate it as this is driving me crazy now.
Hi,
Thank you very much for your help.
I have a question.
On my site I installed woocommerce, and for graphic reasons most of the images are transparent png. These images have already been optimized in photoshop and weigh very little even though they are not small in terms of pixels.
My problem is that wordpress or woocommerce reduce these pngs and worsen the resolution, all this also leads to a disproportionate increase in weight.
I load images from 100 / 150kb and with the resizing they weigh 400 / 500kb sometimes even more.
What do you advise me to do?
I thought it would be better to block resizing and compression for png images. So as to display the original images in all the pages of the site, resized only visually with respect to the design of the page.
How can I do this?
Do you have any other advice?
Thank you