Learn how to regenerate the thumbnails for your image attachments when you need to resize images to fit a certain theme.
Learning outcomes
- Understanding how WordPress handles images and image sizes.
- Installing the Regenerate Plugin.
- Regenerating thumbnails for all media or certain images.
Comprehension questions
- How does WordPress save an image when it is uploaded?
- Why do some images become distorted when you change themes?
- What is an open-source plugin?
- In which view will you be able to regenerate individual or groups or images?
- What essentially happens when you regenerate thumbnails for image attachements?
Transcript
Good day and welcome to Learn WordPress. Today we are going to look at how to regenerate thumbnails or new image sizes in WordPress. But you may ask, why would I need to regenerate thumbnails? Well, a problem that WordPress users can bump into one day is that the featured images appear cropped and out of proportion. And this happens a lot after you’ve changed your WordPress theme. Normally, when you upload images to WordPress, they are being resized to the theme’s requirements. So after you’ve changed the theme, you may find the thumbnails for the previously uploaded images are distorted as they have been sized according to the old theme’s requirements. Don’t stress; we have a solution. Firstly, let’s recap the objectives of today’s workshop. At the end of this lesson, you will understand how WordPress handles images and image sizes; you will be able to instal the regenerate plugin and use the plugin to regenerate thumbnails for all media or only for certain images. So let’s say you change your theme, and some images are distorted. To remedy the situation, one can use the regenerate thumbnails plugin.
The Regenerate Thumbnails plugin is an open-source plugin, but you may decide to use another plugin such as Regenerate Thumbnails Advanced or Dynamic Featured Image. There are more options available in the directory. In today’s workshop, we’ll be using Regenerate Thumbnails. Essentially, the plugin starts generating new image sizes defined by your new theme or media settings. Let me provide some more clarity by looking at how WordPress handles images and image sizes. If you go to Media Settings, you will see that WordPress gives you three default image sizes that can be customised. These sizes are all generated when a new image is uploaded through the Media Library. And here are the default options which you can change if you wish to. The thumbnail size is 150 by 150. The medium size is 300 by 300. And the large size is 1024 by 1024. Remember to save any changes. If you check the uploads folder, you’ll see something like this. In addition to the original picture JPG, three sizes were generated.
So as we mentioned earlier, these files are created at the moment the files are uploaded to the Media Library. But if your theme has different size requirements, it will override your default settings. Now here is where it gets tricky. If you change your theme, your old images might not be able to fulfil the requirements of the new theme and can lead to distorted design. And this is where we need help from the Regenerate Thumbnails plugin. This will allow you to resize all the images you uploaded before to conform to the size requirements of your new theme. Now, in real life, we recommend making a backup of your WordPress site before adding and activating a new plugin. So let’s go ahead and install the plugin. Go to the left-hand side of the dashboard and click on plugins. Add new because we are going to look up a new plugin. And then, on the right-hand side, go to search plugins and type in regenerate thumbnails, and you will actually see it’s the first plugin that comes up. The next step is to install the plugin. So click on install now; let’s wait a sec. And then, afterwards, we have to activate the plugin. Click on activate, and now we are ready to use the plugin.
So we will demonstrate the way this plugin works by modifying image settings and not inter-exchanging themes with different requirements. So let’s start. Create a new post and choose Add Media. I’m going to make a heading and call it ‘Regenerate Thumbnails’. Upload a picture to the Media Gallery and place it in the post-draft twice. Make sure the first time it’s uploaded as a ‘thumbnail’. Now we are going to upload the same picture again. Image Media Library and then click Select. This time we are going to save it as ‘medium’. Then publish the post. Now edit the Media Settings of your images. Go to Settings, click on Media and change the thumbnail settings to 200 By 200, the medium size to 400 by 200, and remember to save the changes. To finally enforce regenerating the thumbnails for your site’s needs, go to Tools. And at the bottom, click on regenerate thumbnails. And now we’re going to click on regenerate all thumbnails to regenerate new image sizes as defined by your theme or the settings media page. Look at the conversion progress and note that you may need to wait for quite a bit of time if your Media Library is large. Now we are going to edit the previously created post and add a new thumbnail size image. Use the same image as before so that you can compare. Remember, you can add an image by writing dash /image or click on the plus sign and add an image via the Media Library. You will notice the old pictures are still left in the dimensions they were in while the new one is sized as expected with the new theme’s requirements, which is 50 pixels bigger in both dimensions. But you might only want to regenerate thumbnails for a certain image.
So go to the Library section under Media. Switch to the list view, and then you choose the image you would like to alter and click on the regenerate thumbnails link on the right of the image, and then you click regenerate thumbnails, and the process is done. Alternatively, you can use the WordPress media regenerate command if you are using the command-line interface. I trust you have found this workshop helpful. Please explore Learn WordPress for more workshops and training material.
