Media Library 104

Editing Images in WordPress

In this WordPress video tutorial we demonstrate a commonly overlooked feature of WordPress – how to use WordPress to edit images. This video will teach how to crop, rotate, and resize images all from within the WordPress dashboard.

WordPress Tutorial Transcript

Hello and welcome to LifeGuard. In this video, we’ll be showing you how to use WordPress to edit your media. When editing a post or page, you can add media from right within the editing interface. While we’re going to show you how to edit from the upload interface, you can of course access all of your media by going to the Media Library in the sidebar.

First, we’ll start by clicking Upload/Insert. Here, you can upload a new image, or navigate to the Media Library tab to display your uploads. Click “Show” next to the image you want to edit. If you chose to upload the image on the previous step, you’ll be presented the image details by default. Next, click “Edit Image” underneath the image preview.

What’s not immediately obvious, but probably the most useful, is the ability to click and drag a crop on the actual image itself. If you want to increase or decrease the selection proportionally, just hold the SHIFT key while dragging.

With a crop region selected, you can use the arrow keys to tweak the selection. Tapping any one of the arrows will move the selection by 10 pixels. If you hold the shift key while you tap the arrows, it will limit the movement to 1 pixel at a time instead of 10. You can use CTRL with the arrow keys to resize. Once you’re done with your selection, just click the crop icon.

The next set or buttons will rotate your image either counter-clockwise, or clockwise. You can also flip your image vertically or horizontally. The last two buttons allow you to undo your changes.

If you have a specific size you need the image to be, just click the Scale Image link. You can enter the dimensions and then click “Scale”. “Restore Image” allows you to go back to the original image after you’ve made changes.

The Image Crop box is useful for constraining your crop region to a specific aspect ratio. Let’s say you have an existing selection that you want to make square. Just enter an ratio of 1 to 1. Now you have a square selection. if you hold SHIFT, you can edit this and make it larger proportionally.

The Thumbnail Settings box allows you to choose whether or not the changes you make to the full image are shown in the thumbnail version. If the default is selected, any changes will affect all images. You could just have the changes effect the image thumbnail, or all sizes except the thumbnail.

To show you an example, we’ll select an area to crop. We’ll select the last option, “All sizes except thumbnail” to keep the edit we made from affecting the thumbnail. You’ll see when we click “Save”, the thumbnail remains the same, even though the larger version of the image is cropped.

If you are interested in learning more about image sizes and thumbnail cropping, watch the Settings 105 video which covers Media.