Images and video are the quickest path to a beautiful and engaging website for your constituents, and WordPress gives nonprofits amazing tools to manage media. Knowing how to use the Media Library and is key to getting the most out of your site and keeping it easy to manage.
Media Library Basics
To get started, watch this brief video from iThemes introducing you to the Media Library.
The Media Library is home to all the files you upload. You can insert those files into any WordPress Post or Page, and any file you upload to a Post or Page also goes back into your Media Library.
When working on WordPress pages, the “Add Media” button is your one-click solution for uploading and inserting images.
Media Library Best Practices
Getting the most out of the Media Library requires more than just understanding the mechanics of uploading and inserting images.
Follow these best practices for the best results with your media:
- Prevent Duplicate Files
- Always Set “Metadata”
- Only Right- or Center-Align Images
Prevent Duplicate Files
Since every image you upload ends up in the Media Library, always make sure the image you want hasn’t already been uploaded.
That means if you click “Add Media”, make sure you select the “Media Library” tab of the popup window to browse or search for the image you need before uploading any new files.
Media Deduper is a new free plugin that attempts to remove duplicates and prevent uploading of duplicates. Using it to remove duplicate files on an existing site is quite risky and not recommended, but using it to prevent duplicate images on a new site is a great idea.
Always Set “Metadata”
“Metadata” is the information you enter about each file you upload. Every time you upload a new file, you should immediately give it a good title and alternative text (images only).
Let’s go through each media field:
- Title*: The administrative title for any file. Easy to search. The title may become public, but it’s mostly for you.
- Caption: Optional field to display below images.
- Alt Text*: Short for “alternative text.” Displayed anytime the image fails to load. Alt text should be 3-5 words describing the image. The alt text is also read aloud to any users of your site with vision impairment.
- Description: A semi-private field great for storing extensive details like the photographer, publication date, etc.
* While not technically required, treat the two fields with asterisks as if they were.
No one ever goes back to enter metadata into the Media Library after the fact, but it’s crucial for keeping your files organized. Just do it!
Bonus Tip: “Tag” your titles
Power users with big libraries should consider adding a “tag” to all Titles in the Media Library. At the beginning of each title, insert a single word to describe the type of image: [Logo]. [Icon], [Infographic], etc.
Once you do this, you can then search for your tags in the search field and group items by tag if you order your media alphabetically!
Only Right- or Center-Align Images
This is an easy one. WordPress makes it simple to have an image on the left with text wrapping around its right. However, this makes text harder to read and page layouts look a little off. Look at most big websites and you’ll be hard-pressed to find a left-aligned image.
Encourage readability on your site by right aligning smaller images and centering bigger ones.
Image Galleries
WordPress comes with built-in support for image galleries, but they are tricky at first. The basic workflow for creating a gallery feels unintuitive to many:
- Click “Add Media” to insert a gallery.
- Enter the “Create a Gallery” section.
- Select your images.
- Insert your gallery.
You’ll probably notice from those steps above that native galleries are always “one-offs” not saved for reuse.
Here’s a video walking you through the steps above:
While there are massive plugins with entirely new interfaces for gallery creation, you are better served by a plugin that enhances the default WordPress gallery. That way, if you want to change your gallery style, you just install a different enhancement rather than rebuilding every gallery on your site.
When it comes to enhancing galleries, Jetpack’s “Tiled Gallery” module is hard to beat. It offers five attractive styles of displaying any WordPress gallery: tiled, tiled columns, squares, circles, and a slideshow.
WordPress’s Magical Embeds
WordPress has an amazing secret: It is almost effortless to embed media from a host of popular sites including YouTube, Vimeo, Twitter, Instagram*, Facebook*, Slideshare, Issuu, Spotify, TED, imgur, other WordPress sites, and more! Here’s the full list.
* As of October 24, 2020, Instagram and Facebook embeds require a special developer access token to embed. You can get around this by enabling the Jetpack “Shortcode Embeds” module.
Make an embed like this:
- Get the URL for the single item you want to embed (e.g. a YouTube video, a Tweet, etc.)
- Paste it onto its own line of the WordPress editor (not as a link, no formatting)
- You’re done!
It’s really that easy! Here’s an embedded blog post from this very site embedded that way!
Make a Social Timeline on Your Nonprofit’s WordPress Blog Without Storify
That article shows how you can use these embeds to create a social media timeline in WordPress without using embeds!
Audio & Video
Insert audio and video files into a post just like an image. Audio files can also be organized into a playlist, just like images are put into galleries.
However, be careful with uploading these files. Too many large media files can quickly use up all your server space or will load slower than if you embedded them (see above) from a service like YouTube, Vimeo, or SoundCloud.
If you don’t like the YouTube and Vimeo branding, consider the video-hosting service provided by Jetpack (aka VideoPress). It’s built directly into the WordPress Media Library but loads files from WordPress.com’s faster servers.