A featured image is one of the most important images that you can add to your blog posts. What makes a featured image so important is the way it is used in WordPress.
The featured image along with the post title is the first thing that people see when they happen to find the links of your website shared on social media. This means that your featured image influences whether people will click through to your post from social media.
These images can also serve another important function depending on the theme you have installed on your website. They can be shown in all the places on your website where you link to an article. For example, let's say you have a sidebar that shows your top five most read articles. You will be able to show your post titles as well as corresponding featured images in that sidebar.
This can make the website more visually appealing and probably increase the click-through rate for those articles.
Some themes also show featured images in the body of the article, mostly directly below the post title. The variant of featured image shown here will usually have the largest size of them all.
Why You Should Change Featured Image Size in WordPress?
When you upload an image to the media library, WordPress automatically generates thumbnails for it. Currently, WordPress generates images in four different sizes by default.
These properly named sizes are : Thumbnail (150px), Medium (300px), Medium Large (768px) and Large (1024px).
Two more variants with 1536px and 2048px width were added in version 5.3. They are not accessible through the WordPress admin dashboard by default. Some themes can also define a specific size for featured images. For example, the WordPress 2021 theme creates a variant that is 1568px wide to display at the top of post title.
WordPress will generate all these variants for any featured image that you upload on your website.
Depending on the theme you are using, some of these generated images might be too big. For example, the featured image in my post was only displaying at a width of 1250px. However, WordPress still loaded the 1568px wide image when I visited the post.
A larger image means bigger file size and that's a waste of resources for both you and your visitors. There is no need to generate featured images that are 1568px wide when you only display them at a maximum width of 1250px.
Changing the featured image size will save storage space and result in faster loading pages for your visitors. A win-win situation!
Change the Featured Image Size in WordPress
If you don't use any plugins, WordPress will only show you three different image sizes under Settings > Media. These are Thumbnail, Medium, and Large. If you would only like to change these three values, you can do so without installing extra plugins.
Changing the sizes for other image variants will require you to either make changes to the theme file or use a plugin. We will show you how to do that with a plugin called Simple Image Sizes here. Once you have installed and activated the plugin, you will see that the Settings > Media page looks like the image below.
You can now simply specify your own dimensions for different image variants. Set both width and height to zero in order to prevent WordPress from generating any images of that size. For example, I have set the width and height for the 1536px and 2048px variants to 0.
You can click on the Save Changes button after specifying your own sizes. Any future uploads to the media library will generate variants based on the size you have set.
One last thing that you should do now is regenerate the modified variants for old images. Simply click on Regenerate Thumbnails and the plugin will do it for you.
Final Thoughts
In this tutorial, we briefly discussed a few important aspects of featured images in WordPress. I hope this helped you understand the purpose of featured images and how you can change featured image size in WordPress.
One more thing that I would like to mention is that you should not put in some arbitrary values for image sizes. Find out what are the most common sizes at which images are shown on your website and then changes these settings accordingly.
No comments:
Post a Comment