My Blog on WordPress Development + Other Goodies

Posted on December 11, 2012 by in Snippets with 10 Comments

How to Change the Quality of WordPress Thumbnails

If you’ve noticed that your thumbnails are not quite as sharp as they should it, it’s because WordPress’ default compression ratio for image generation is not at 100%.

I’ve generally found that clients prefer quality images vs. the extra resources needed to generate said images, so this code snippet should in handy for you. This code also addresses images being resized via the new WP_Image_Editor class that was just released with WordPress 3.5.

While the old filter only handled the compression quality of JPG images, if your instance utilizes ImageMagick, the new filter applies the compression ratio to other image types as well. The filter expects an integer based on the scale of 1-100. WordPress defaults to 90, so feel free to leave it as it is or change it to whatever you may need it to be!

**Note: This will only apply to thumbnails and images generated after you have inserted the code into your theme. If you want this to apply to existing images and thumbnails, you should use a plugin like Regenerate Thumbnails to create new, better quality images with the updated compression ratio.

It should also be noted that if you decide to extend the new WP_Image_Editor class, you can set the quality of images individually via the WP_Image_Editor::set_quality() method. The filter listed above trumps this method as it is set on a global scale, but it can be useful for individual instances of creating new image sizes if a global filter doesn’t fit the bill.

Do you like what you have read and want to receive content updates? Sign up below and also get my
"7 Tips to a Professional WordPress Setup" absolutely free!

  • http://twitter.com/contempoinc Chris Robinson

    Nice one, got a lil’ type in add_filter “wp_editor_set_qualiy” should be “wp_editor_set_quality”.

    • griffinjt

      Thanks for the catch! Updated.

  • GetSource

    Just a quick note: You might want to correct wp_editor_set_qualiy to wp_editor_set_quality.

    It’s also the case that you might want a *little* compression still, since with JPEGs, at the top percentages (anything below 100%), there aren’t many compression artifacts, but the size is significantly smaller. So, testing for your use-case, to make sure that images aren’t bigger than they need to be, is helpful.

    • griffinjt

      Thanks for the catch! I’ve updated it.

      And thanks for your added insight! :-)

      • GetSource

        No problem — thanks for the article!

  • http://twitter.com/joey89924 joey

    no bigger than they need to be, is helpful.
    SK34

  • http://www.facebook.com/marcovitale Marco Vitale

    where do I have to insert this code? which file?

  • Melanie Vaughan

    is so helpful Thanks !
    Visit Here : http://www.i4graphics.com.au/

  • http://www.facebook.com/elchuchurro Manuel Sanmartin

    Hi there
    thanks for the article. Just wanted to know which file this code needs to be added?

    Thanks

  • http://www.mathewporter.co.uk/ Matt Porter

    awesome, not that i need it quite on my site, but with recent work to drastically aid page load speed, implemeting this could help further for thumbs which i dont get control over the optimisation.