Working with Images and the WordPress Media Library

Now that we’ve covered how to create a blog post, it’s time to take a closer look at working with images in WordPress. While the last post included some information on adding images to your posts and pages, you might be wondering what else you can do with them.

In this post we will explore the WordPress Media Library, in order to help you understand where your images, and other media files, are stored once they are added to your website. We will also look at how you can carry out basic editing on your images, including changing their size with the scaling or cropping tools, as well as rotating and flipping them.

Finally, we will cover how to add image galleries to your posts and pages. This feature of WordPress makes it easy to insert a selection of images into a post, and then configure how they are organized. You can also control what happens when a visitor clicks on one of the images in the gallery.

If you want to get a better understanding of how WordPress handles images and other media files, as well as what you can do with them, this guide to the Media Library will get you up to speed.

Every WordPress website has its own media library. Each time you add an image to a post, page, or elsewhere on your website, it is automatically added to the media library. This library of media files, such as images, video, audio, and other items, can be found under the Media item on the sidebar menu of your WordPress website’s admin area.

Once you’ve opened up the media library, you can then change the view from either list or grid layout. You can also filter the items by type or date, as well as searching the library to specific files.

Clicking on an item in the media library allows you to inspect the file and find out more about it. The attachment details screen displays information about the file. This includes its name, type, upload date, and file size and dimensions.

You can also see which post the image was uploaded to and therefore, where it is being used on your website. The URL field on the attachment details screen displays the direct link to the file. This can be useful if you want to manually link to the media file from one of your posts or pages, or even externally from your website. Examples of this could be in an email or social media post.

By default, every image and other type of media file that gets uploaded to your website, also gets its own attachment page. This is a page on your website that includes that file, as well as some other basic information about the file. When inserting an image or other media file into a post or page, you can choose to link to this attachment page, or simply display the image.

Although any images, or other media files, you insert into your posts and pages are automatically added to the media library, you can also add them directly to the library yourself. You might want to do this if you’d like to make a number of files available to your co-authors for use in their posts, or you need to link to the files from elsewhere on your site, or link to them externally, without publishing them in a post.

Adding the images directly to the media library is very straightforward. By clicking on the Add New item under the Media sidebar menu, you can then drag and drop them into place. Alternatively, you can click the Select Files button, to locate the files on your computer the old fashioned way. Whichever option you choose, you can select multiple files at once, in order to save time.

Once the files are in the library, they can be edited and inserted into your posts and pages by clicking on the Add Media button on the post editor screen.

When viewing the attachment details page for an image, you might have noticed an Edit Image button. Clicking this button allows you to make some basic changes to the image. These basic image editing features include: cropping, rotating, or flipping images.

However, you can also proportionately scale an image to reduce its dimensions, while still maintaining its aspect ratio. Furthermore, you can also crop an image by dragging the cursor over it to make a selection. This allows you to select the area to be kept, with the rest of the image being discarded.

After you’ve made any changes, don’t forget to save the image before returning to the media library. Now you can insert the new version of the file in to your posts and pages. Any previous instances of the image used on your website will remain as they did before.

Whenever you upload a new image to your website, WordPress creates three more versions of that file: thumbnail, media, and large. Each of these three versions has a different set of dimensions, or physical size. If necessary, you can change these three default sizes through the Media Settings screen.

As most good WordPress themes are built to work best with specific images sizes, when you change themes, the new theme may adjust these settings. This is to ensure any images uploaded match the design and layout of the theme. Therefore, in most cases, it’s best not to change these settings yourself.

Through the media library settings, you can also set how the files are organized on your server as you upload them.

As each image you add to your WordPress website is automatically added to the media library, the size of the library can quickly grow. While you won’t want to delete any images that are used in your posts, you may well want to delete the images in the library that haven’t been used on your site.

Thankfully WordPress makes it easy to see all the images or other media files, that haven’t been inserted into a post. By selecting Unattached from the filter drop down list, you can then view all the unattached files in the media library.

These are the files that were either uploaded directly into the media library, rather than being inserted into a post first; or they are files that were added into a post, but that post has since been deleted.

If you are sure you no longer need these files, they can be deleted in one fell swoop, by clicking on the Delete Selected button.

As well as inserting individual images into your posts and pages, WordPress also lets you create basic image galleries. This feature gives you the ability to display multiple images, which your readers can then view the thumbnail of. They can then decide whether to click to view the full size image, or not.

After clicking on the Add Media button, instead of inserting a single image into your post, click on the Create Gallery button.

From the create gallery screen, you can select multiple images to include in the gallery. To make the selection, hold down the Ctrl key on your keyboard as you select the images to be featured in the gallery.

After you’ve made the selection, you can click on the Create Gallery button to proceed to the next step. From this screen you can give your images an optional caption, and choose how the gallery is displayed.

When you are ready, clicking the Insert gallery button adds the images to your post. Now your readers have the option of simply viewing the image thumbnails, or clicking on them to full the larger version.

If you want to add or remove images from the gallery, you can select the gallery from the post editor, and then click on the pencil edit icon.

Now you can continue to work on the image gallery, before clicking the Update gallery button to reinsert it into your post or page.

Hopefully you’ve now got a good understanding of how WordPress stores and manages the images and other media files that you’ve added to your website.

Being able to use the Media Gallery and its image editing features, gives you the ability to quickly make basic changes to your media files, rather than opening them up for editing in another application. While these tools won’t replace dedicated image editing software, they can certainly reduce your reliance on them for basic tasks.

Using WordPress image galleries can also be a handy way to work with images more effectively on your website. Working with image thumbnails, which automatically link to larger versions of your photographs and other images, can help your pages load faster, while also allowing your visitors to see more of your media content, on one page.

If you have any questions about working with images in WordPress, or another features of this software, please leave a comment below.