Another classic: the image size preset is set to 1024 pixel. At first everything is alright, while the project is evolving the CMS structure built, the website filled with content – images are uploaded. Then occasionally somebody involved with the project wants to add an image gallery or something similar, that makes you reconsider the image sizes. Maybe 1200 pixel width would look better in a lightbox slideshow – or you want to switch to retina ready images? But at that moment all previously uploaded images are of 1024 pixel width.
In Settings > Media you can easily change the image sizes for the three main presets Thumbnail Size, Medium Size and Large Size. All you have to do is change the size to the intended new size and save the settings.
While the new sizes will be applied to all new images, they won’t be applied to already uploaded images. Even is you open and edit an image, you’ll find the old presets.
When you’re first confronted with this, you’ll probably ask yourself, why are my new image sizes not available in the image settings? The reason for this is quite simple: the image sizes displayed in ‘image details’ are the ones that were already applied to the image. Once you upload a new image in WordPress, the current settings are applied to the image – the image is resized on the fly – and so you’ll actually have the image in these sizes on your server. The Display Settings Selector only reflects the sizes that are actually available.
You could now choose ‘Custom Size’ and re-insert the image. But that won’t actually resize the image – it would only scale it according to the custom size you chose.
Instead you better re-render all images in the new dimensions. This might sound a bit scary at first, but (of course) there is a (free) plugin available that does just that: Regenerate Thumbnails.
After re-rendering all images, the new image size settings should be available for all images.
Re-render / resize large number of thumbnails on the fly
Using the above solution to resize images / thumbnails can be a bit problematic when you have lots of images to re-render, since the plugin basically re-renders all images at once. That probably works fine with most websites – but when you have to resize hundreds or even thousands of images, the process may cause problems: depending on your server settings you may face time-outs – or the re-rendering process just never re-renders all images.
AJAX to the rescue!
The handy plugin AJAX Thumbnail Rebuild also re-renders all images at all sizes – but using AJAX the images are re-rendered one by one, avoiding heavy server load and/or time outs etc.
Once installed you’ll find the interface right here: Tools -> Rebuild Thumbnails