Images are important for your website: they make your pages visually appealing and help get your message across better. But if you don't set them up properly, they can make your website slower - and of course you want to avoid that.
Image optimisation consists of several components. One is adjusting the image formats. By loading images at the right size, you avoid unnecessarily large files and improve the loading speed of your website. This is not only nice for your visitors, but also good for your findability in search engines like Google.
In this article, we'll show you how to manage, adjust and optimise the formats of your images in WordPress - either manually, with code or using handy plugins.
What happens when you upload an image to WordPress?
Uploading images to WordPress is very easy. But more happens behind the scenes than you think. As soon as you post an image, WordPress automatically creates three additional versions in different formats:
Thumbnail (small view)
Medium (medium size)
Large (large format)
Original image
So WordPress is already giving you a hand in optimising images. However, there are still a lot of things you can do yourself to make even more optimisations.
Resize images yourself
The default image formats created by WordPress work fine for many websites. But sometimes they just don't fit what you need. Think of larger thumbnails for an online shop, smaller large images for faster loading times, or fixed sizes for a portfolio or landing page. In that case, it is smart to set custom image sizes yourself.
Note that the more formats you add, the more files will be stored on your server. This can slow down your website and take up unnecessary disk space. So choose only the formats you really need. By using image sizes consciously, you keep your website fast, clear and user-friendly - exactly what search engines and visitors appreciate.
Customising image formats with plugins
Want full control over the formats of your images in WordPress? Then the Image Regenerate & Select Crop plugin is a handy tool. With this plugin, you can easily create custom image formats as well as update existing images to your new settings.
After installation, you will find the options under Settings > Media. Here you can add unlimited new image sizes to suit your website. In addition, the plugin offers handy features such as automatic cropping of thumbnails and re-generation of existing image files, so that everything is displayed neatly in the right proportion.
This plugin is ideal for websites with specific requirements, such as webshops, portfolios or landing pages. By setting your own formats, you keep your website visually consistent as well as optimised for speed and user experience - important factors for good SEO performance.
Manually adding custom image formats via functions.php
Want to set your own custom image formats in WordPress? With a little bit of code, you can easily add additional formats to your theme. Follow the steps below and customise your site exactly to your needs.
Step 1: Add new image formats in your functions.php file
Start by opening your WordPress dashboard. Go to Display > Theme editor and open the functions.php file. Create always back up first of your site before modifying anything.
Then add this line if it is not already there:
add_theme_support( 'post-thumbnails' );
Then you can add custom sizes using the add_image_size() function. For example:
- add_image_size( 'post-thumbnail', 800, 240 );
- add_image_size( 'homepage-thumb', 220, 180 );
- add_image_size( 'fullpage-thumb', 590, 9999 );
You can choose the names yourself (like homepage-thumb) and the numbers indicate the width and height in pixels.
Step 2: Display your custom image in your theme
To make your new image format visible on your website, add the following line in the appropriate theme file, where you want to display a featured image:
<?php the_post_thumbnail( ‘homepage-thumb’ ); ?>
Replace 'homepage-thumb' with the name you chose for the custom format. Make sure you include this code within the WordPress "loop" places - that's the part of your template where posts are displayed.
Step 3: Regenerate thumbnails of existing images
If you have previously uploaded images, they need to be generated again in the correct formats. To do this, install the plugin Regenerate Thumbnails.
In your dashboard, go to Tools > Regenerate Thumbnails and click on the Regenerate All Thumbnails. This way, even older images are adapted to your new settings.
Customise image formats via the WordPress media library
Do you use an image only once in a specific size? Then it is often more convenient to resize it manually instead of creating a custom image format. Fortunately, WordPress has a built-in image editor for this that allows you to do this quickly and easily.
Go to your Media library via the menu Media in the dashboard. Click on the image you want to edit, then under the preview, choose the button Edit image.
You will now see the current dimensions of the image. If you want to change the size, enter the desired width and height and click on Scale. WordPress automatically adjusts the format based on what you entered.
Still not satisfied with the result? No problem - you can always restore the image to its original size by pressing Restore Original Image click.
This feature is ideal for quick adjustments without extra plugins or code, and helps keep your website clear and fast.
Summary
Customising image formats in WordPress is a smart way to make your website faster and more user-friendly. Do you have any questions about setting image formats or want to share your own tips? Let us know in the comments below - we'd love to hear from you! 👇
