Skip to Main Content

How to compress and resize images on WordPress

Divi: the easiest WordPress theme to use

Divi: The best WordPress theme of all time!

With over 701.000 downloads, Divi is the most popular WordPress theme in the world. It is complete, easy to use and comes with more than 62 free templates. [Recommended]

Need to compress images or want to resize images in WordPress?

Having good, decent images can be tricky when it comes to improving the performance of a WordPress website. So much so that we had a few subscribers, who always asked us how to compress and resize images properly.

This is an important aspect in optimizing your website that we all have to go through. If you've been following us for a long time, you've probably heard of the Hummingbird plugin from WPMUDEV.

This is a plugin that can allow you to reduce the size of an image of 75%, which is considerable.

So, in this tutorial, I'll explain how to manually resize your images in your dashboard and in your WordPress theme.

But before, if you have never installed WordPress discover How to install a WordPress theme et How to search, install and activate a WordPress theme on your blog 

Then back to why we are here.

Why do you need to resize and compress your images?

This is a suggestion that offers Hummingbird. This suggestion means that you are using an image uploaded to your WordPress blog where the size is larger than what is used in your theme.

This often happens when there is an error with the WordPress theme you are using and larger images are not automatically cropped to the expected dimensions. Instead, they are resized to fit.

Go further by discovering Why do you have to start optimizing your WordPress blog by images

This means that when a visitor loads the page with the oversized image in their browser, the original size of the image is loaded and then it is resized to fit the dimensions specified in your WordPress theme.

This extra, sudden step of resizing larger images requires additional requests and resources from the server to load on a page.

Discover also our 10 WordPress plugins to generate traffic to your blog

The result is a slower page speed, a lower Hummingbird score, hence the recommendation to compress and resize the images.

compress images - humminbird image compression

Although WP Smush Pro may automatically resolve the recommendation to compress an image, this is not the case with the suggestion " compress and resize". For the latter, you have to make the change manually and there are several ways to do it:

Easily create your website with Elementor

Elementor allows you to easily create any website design with a professional look. Stop paying expensive for what you can do yourself. [Free]

  • Edit the functions file of your WordPress theme and template files
  • Crop the image to the size expected in the multimedia library
  • Adjust multimedia settings

Below you will find more details on how to resize your images with these methods.

Saving the image sizes of your WordPress theme

To fix this problem in your theme, you need to make sure the images are saved correctly. For more information on how to do this read our image resizing tutorial for your theme.

If you'd rather not touch any code, you can notify the author of your WordPress theme and ask them to make the necessary changes for you. Once the patch is complete, you can update your WordPress theme to add the changes to your website.

Upgrading your images in WordPress

While you might wait for your WordPress theme developer to fix this problem, there are other manual image resizing methods you can try that we offer below.

Collapse images in the media library

To crop an image manually, go to " Media> Library And select by clicking on the image you want to crop. Then click on the button Edit Image to open the editing interface.

resize pictures - edit wordpress media picture

Crop the image as needed using the corresponding options on the right. Keep in mind that if you scale the image down to match the width you need, the height may be shorter or longer than the size set by your WordPress theme depending on the dimensions of the original image.

You can also use one of the 6 WordPress image editing plugins that you will discover by consulting this link 

If you choose to enlarge your image, it remains in the appropriate proportion to the original image. On the other hand, if you decide to crop your image, it may not necessarily be a matter of proportionally editing it based on the dimensions you choose.

You can either resize your image by typing the desired width and height, then clicking on the " resize Or if you prefer to crop your image, you can do so by clicking and dragging your mouse over the image and selecting the desired area. Then release the mouse click to reveal your selection.

Image resizing on wordpress

Once done, do not forget to click on " Save". You can also apply the settings to any size.

Apply size to images

Are you looking for the best WordPress themes and plugins?

Download the best plugins and WordPress themes on Envato and easily create your website. Already more than 49.720.000 downloads. [EXCLUSIVE]

This option to change the size of the images is also available from the media library.

Image modification in the media library

Discover also some premium WordPress plugins  

You can use other WordPress plugins to give a modern look and optimize the grip of your blog or website.

We offer you here some premium WordPress plugins that will help you do that.

1. Bpchat

Bpchat is a WordPress extension of BuddyPress that sets up a chat system on your blog or WordPress website.

Wordpress buddypress users chat plugin

Once this plugin is installed on any blog, forum, community, directory, e-commerce website or social website BuddyPress, all connected users can automatically chat instantly.

Ce WordPress plugin also sets up an easy way to chat online, which looks a bit like what Facebook offers.

Download | Demo | Web hosting

2. Click to WhatsApp Chat

The WordPress Click to WhatsApp Chat plugin allows WordPress customers to easily connect with the website owner or customer support using their WhatsApp account.  Click to whatsapp chat for wordpress

Just a click on the WhatsApp account and it will be directed directly to the mobile WhatsApp account with a default message. And if the client is on desktop or laptop, he will be redirected to WhatsApp Web.

Discover also our 10 WordPress plugins to hide premium content on your blog

This plugin requires the WhatsApp number and time and day, which the website owner or support team will use to discuss. Chat button can be added on the product detail page WooCommerce, which is directly related to this product.

Download | Demo | Web hosting

3. WooCommerce Extra Product Options

WooCommerce Extra Product Options is a WordPress extension that will allow you to create additional product options with support for conditional logic. You will also be able to create forms, convert attribute dropdowns to radio buttons and more.

Woocommerce extra product options

Among its features we will find among others: the psupport for multiple types of fields, the cprices according to the selected fields, the visual constructor of the form fields, the support of shortcodes, the possibility ofactivate its options for specific roles, thehoix between the increase on fixed or percentage prices, the iimport / export to other forms, the possibility to hide or display prices, the support of theconditional logic on fields and sections in the form constructor, theompatibility with several plugins and eCommerce extensions, a Ddetailed documentation, and Much more …

Easily create your Online Store

Download free WooCommerce, the best e-commerce plugins to sell your physical and digital products on WordPress. [Recommended]

Download | Demo | Web hosting

Recommended Resources

Find out about other recommended resources to help you build and manage your website.

Conclusion

Here ! That's all for this tutorial, I hope you'll be able to edit, resize and compress your images. Do not hesitate to share with your friends on your favorite social networks

However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation.

If you have suggestions or remarks, leave them in our section Comments.

...  

This article features 2 comments

Leave a comment

Your email address will not be published. Required fields are marked with *

This site uses Akismet to reduce unwanted. Learn more about how your comments data is used.

Back To Top
7 shares
Share6
tweet
Save1