How to use the WordPress media library

Article written by Toby Osborne
Category: WordPress
Updated on 09th October 2020

You can use the WordPress Media Library to add images, videos and audio files into the different posts and pages across your website.

What is the WordPress Media Library?

The WordPress Media Library is a gallery of uploaded files used across your website. It offers the ability to view, edit and manage all the media assets from one location.

Although the most common purpose of the Media Library is as an organisational tool, it also offers various features that are easily overlooked, including:

• Image editing.
• Media SEO Meta editing.
• Thumbnail Generation.
• Image Resizing.
• Image Cropping.

What formats are allowed in the WordPress Media Library?

As standard, the WordPress Media Library can store image, video, audio and document files in a number of formats including:

Images: .jpg, .jpeg, .png, .gif
Audio: .mp3, .m4a, .ogg, .wav
Video: .mp4, .m4a, .mov, .wmv, .avi, .mpg, .3gp, .3g2
Document: .pdf, .doc, .docx, .odt, .txt, .xls, .xlsx, .csv .ppt, .pptx, .pps, .ppsx, .key, .zip

How to access the WordPress Media Screen

You can access the media library from the WordPress Dashboard by clicking the Media link in the main menu (black sidebar on the left).

You can change the view of the media screen between List and Grid layouts by clicking either of the two icons on the left side of the white bar at the top of the screen.

To the right of the layout icons, is a select box that lets you filter uploads by their file type. And right again, is a select box to filter items by the month that they were uploaded to the site.

To the far right of the white bar is a search box that filters items by the text that you enter.

How to add files to the Media Library

You can add files to the media library in several locations of the WordPress dashboard, including the classic post/page editing screen, Media screen or the more recent WordPress block editor.

Adding files to the Media Library from the Media screen

You can upload files directly to the media library from the media screen by:

1. Hover your mouse over the Media menu item.
2. Click Add New.
3. Click Select Files.
4. Find the files from your computer or other devices you’d like to upload.
5. Click Open (or similar).

Adding files to the Media Library with the classic WordPress editor

While editing a page, post or category, you can add new files to the media library by:

1. Click Add Media (located above the main text editor)
2. Navigate to the Upload Files Tab
3. Click Select Files.
4. Find the files from your computer or other devices you’d like to upload.
5. Click Open (or similar).

Adding files to the Media Library with the WordPress block editor

While editing a page or post that uses the block editor, you can upload new files by:

1. Selecting the block type of the file you’d like to use. (Image, Audio, File or Video).
2. Click Upload
3. Find the files from your computer or other devices you’d like to upload.
4. Click Open (or similar).

How to remove files from the WordPress Media Library

Removing files from the WordPress Media Library can be done from the Media screen in the WordPress Dashboard by:

In grid view:

1. Access the WordPress Media screen.
2. Click the upload you’d like to delete.
3. Click Delete permanently (in the bottom right)

In list view:

1. Access the WordPress Media screen.
2. Hover your mouse over the upload you’d like to delete.
3. Click Delete permanently (shown under the title of the file).

How to edit images in the WordPress Media Library

The WordPress Media Library has basic image editing functionality that allows you to crop, resize, rotate or flip supported image files.

To access the image editor:

1. Access the WordPress Media screen.
2. Click the image you’d like to edit.
3. Click Edit Image.

To crop a file:

1. Click the Crop button at the top of the screen.
2. Drag the corners of the box (visible over your image) into the position you’d like to crop.
3. Click the Crop button again,
4. Click the blue Save button.

To rotate, or flip the image:

1. Click the relevant button at the top of the screen.
2. Click the blue Save button.

Fixing the WordPress HTTP Error while uploading a file.

The HTTP Error can occur for several reasons, most of which have easy fixes. Yay!

First, we’ll determine what is causing the error to appear. Our recommended process is:

Refresh the page (be sure to save anything you’ve changed first).

Often the HTTP error is caused by your login session expiring, which means that refreshing the page will redirect you to the login page. After logging back into your account, try the upload again and if it doesn’t work move on to the next step.

Rename the file

Occasionally the issue can be caused by the name of your file. Rename it avoiding special characters and symbols and try uploading it again.

Folder Permission

It may be that your website doesn’t have the correct permissions to add new files to the uploads folder that WordPress is trying to use.

Make sure that the folders located under /wp-content/uploads have the correct permissions 755 (drwxr-xr-x) or 750.

Disk Space

If renaming the file didn’t do the trick then the next likely cause is your server is running low on disk space. Shrink, or compress the file you’re looking to upload and give it another shot.

Fixing the Format(s) not supported error while uploading a file.

If you get the “Format(s) not supported” error message while uploading a file to the WordPress Media Library, you’re likely trying to upload an unsupported file type.

To fix this, you should first ask yourself if the format you’re uploading is safe to use on the web, and if the answer is yes, you can add support by adding a small code snippet to your functions.php file.

How to add support for file formats to the WordPress Media Library

It’s possible to add support for additional file formats by utilising the upload_mimes WordPress filter.

Though the media library supports the more common file formats, several modern ones aren’t allowed by default; such as SVG, WEBP and APNG. Luckily, it’s easy to add support for new file types with a small code snippet added to the functions.php file of your theme.

function add_mime_support($mime_types){ 
	$mime_types['svg'] = 'image/svg+xml'; 
	return $mime_types;
}
add_filter('upload_mimes','add_mime_support',1,1);

The above code will add support for the SVG file format and works by assigning the file extension and mime-type to the array of support file formats that WordPress uses when a file is uploaded.

$mime_types[‘svg’] is the array of supported formats, with the ‘svg’ portion being the file extension e.g.”.svg”.

‘image/svg+xml’; is the portion that sets the allowed mime-type for files uploaded with the SVG extension. You can find a pretty comprehensive list of mime-types from Sitepoint.

How to use the WordPress Media Library

Like anything using the WordPress Media Libray gets easier with practice. Though the Media Library has a lot of features, it’s primary function is as an uploading and file management system.