How To Crop WordPress Images (The Smart Way)

Many WordPress website owners have struggled with uploading an image and inserting it on a page, only to find that the layout is messed up. Creating custom image sizes can also result in people’s faces being cut off because the system doesn’t detect and crop the correct focal point.

Besides that, cropping the images uploaded to a WordPress site manually can be a time-consuming endeavor. You and your team’s time would be better spent learning how to smart crop WordPress images to focus on what’s important to drive more impact for the customers.

Here’s an example. This is the original image:

This is the version after being cropped by WordPress after the image sizes were generated. Instead of getting cropped properly, the top part is chopped off.

How to crop WordPress images manually

You can crop WordPress images manually, or using WordPress’ basic editing capabilities, as long as you have a simple landing page or presentation website without too many images.

However, for websites with huge image libraries such as blogs and eCommerce stores, cropping images manually is a very tedious endeavor, which comes with some drawbacks. The most major downside is the time spent doing it while you could focus on something else.

Before uploading the image to WordPress

There are a lot of online tools available when it comes to cropping images before uploading them to your WordPress site. Some of our favorite free solutions are:

• Photopea (Free online photo editor)
• iLoveIMG
• Image cropping tool from Adobe Express.

As mentioned, this a good way to crop your images in case you don’t have to deal with a lot of images.

After uploading the image to WordPress

After uploading the image to your WordPress site, you can crop the images manually directly from the post editing screen. However, you have to go through at least a dozen steps, as outlined below:

1. Find the image in the Media Library and click it.
2. Click the Edit Image button below the image.
3. Select the Crop tool and adjust the image by either dragging the frame directly on the picture or typing exact sizes and/or aspect ratio in the Image Crop tab on the right.
4. Once that is done, click the Crop tool again and then finally the Save button (we know this isn’t really intuitive).
5. Navigate to the page where the photo is displayed.
6. Select the old image and replace it with the version that you just cropped. The reason why you have to do this is because WordPress creates a new file when the original is cropped.

This is the process you typically have to follow for each image you wish to crop.

How to crop WordPress images automatically (Smart solution)

The best option is to have your images cropped automatically using a smart cropping solution, and this is what you’ll learn today.

Starting with version 5.1, ShortPixel Image Optimizer (SPIO) includes a brand new and polished Smart Cropping feature. That means your images will be cropped accordingly, as seen below:

The Smart Cropping solution works for both the original image uploaded and the image sizes generated by WordPress. Each time an image is sent for optimization by the plugin, the image sizes keep their original size and will display the correct part of the image, as seen above.

Smart Cropping also has a nice additional feature: the cropped thumbnails become sharper. This sometimes makes the Smart Cropping thumbnails a bit larger, but the result is amazing. Here is an example:

Note: The original image is also cropped in the same way, but only if the Resize large images option is enabled in the plugin settings.

How can I enable Smart Cropping?

First, you have to install and activate ShortPixel Image Optimizer on your WordPress site. You can follow the step-by-step guide here.

Once that is done, simply navigate to Settings > ShortPixel > General, look for Enable SmartCrop setting and enable it.

That’s all! Now, your WordPress images will be automatically cropped.

Take into account that Smart Cropping only works for those image sizes that cropping is enabled for. By default, cropping is enabled only the Thumbnail size in the media settings (Settings > Media). The Medium, Large and others are not cropped, just resized, meaning that the original aspect ratio is preserved.

If you want a smartly cropped image sizes, other than the 150×150 thumbnail, we recommend creating custom image sizes using a plugin such as reGenerate Thumbnails Advanced.

Conclusion

Manually cropping images before or after uploading them to your WordPress site is fine, as long as you don’t have to deal with a lot of images. However, it requires a lot of time and effort if we’re talking about media libraries with hundreds of images.

The best solution at your fingertips is to allow a plugin such as ShortPixel Image Optimizer to automatically crop the images for you using the Smart Cropping feature.

Give ShortPixel Image Optimizer a try. FREE up to 100 images per month!