dark-attentiondark-datedark-timedark-contactdark-infodark-play dark-pricedark-venueicon-alert icon-arrow-left icon-arrow-right icon-blockquote icon-cal icon-clock icon-contact UI / Full-Part-Volunteer CopyCreated with Sketch. EPS IconCreated with Sketch. icon-facebook--dark_circle icon-facebook--dark_square icon-facebook--outline_circle icon-facebook--outline_square icon-facebookCreated with Sketch. icon-htm icon-info icon-instagram--dark_circle icon-instagram--dark_square icon-instagram--outline_circle icon-instagram--outline_square icon-instagram icon-linkedin--dark_circle icon-linkedin--dark_squareicon-linkedin--outline_circleicon-linkedin--outline_squareicon-linkedin icon-logo2 icon-mp3 icon-pinterest--dark_circle icon-pinterest--dark_square icon-pinterest--outline_circle icon-pinterest--outline_square icon-pinterestCreated with Sketch. icon-play icon-price icon-spotify--dark_circle icon-spotify--dark_square icon-spotify--outline_circle icon-spotify--outline_square icon-spotify icon-spreadsheet icon-threads--dark_circle icon-threads--dark_square icon-threads--outline_circle icon-threads--outline_square icon-threads icon-tiktok--dark_circle icon-tiktok--dark_square icon-tiktok--outline_circle icon-tiktok--outline_square icon-tiktok icon-twitter--dark_circle icon-twitter--dark_square icon-twitter--outline_circle icon-twitter--outline_square icon-twitterCreated with Sketch. icon-x--dark_circle icon-x--dark_square icon-x--outline_circle icon-x--outline_square icon-x icon-youtube--dark_circle icon-youtube--dark_square icon-youtube--outline_circle icon-youtube--outline_square icon-youtubeCreated with Sketch. FolderCreated with Sketch. icon-zoom light-attentionlight-cal light-clocklight-contactlight-infolight-play light-pricelight-venue

Media Library

The media library stores all images and files on your site.

Accessing the Media Library

Navigate to MEDIA > LIBRARY in the menu on the lefthand bar in the WordPress admin.

Screenshot of media library in WP admin menu

This takes you to the full media library page with the option of viewing all files in a grid view (such as in the screenshot below) or a list view.

screenshot of media library

Here you have the ability to search for a file name, filter by file type, or filter by upload date to find specific files.

You can add images individually or in bulk. Click ‘Add New’ at the top to select a single file or to drag and drop as many files as you would like from your computer to your site. This bulk add feature is great for initial population of your website. 

 

Single File Mode

Click on any image to view the image detail box.

Here you will find the fields for alternative text, title, caption, description, file URL, and more. This is also where you can edit the image.

We recommend adding a title that will your team search for it in the future.

An important field here is the Alternative Text. Al Text is the written copy that appears in place of an image on a webpage if the image fails to load AND is pulled in by screen-reading tools to describe images to readers that have visual impairments AND allows search engines to better crawl and rank your website. We recommend that all of our clients use this field for the highest accessibility.

This is also where you add captions for images that are pulled into the gallery and large image content blocks.

Adding an Image Through a Field

You can also access the media library through image fields on various Content Blocks you add throughout your pages and posts. Image fields (seen in these screenshots) will have an ‘Add Image’ button that allows you to either upload an image directly or select an image from the media library.

Any new file that you upload through this method will be added to the media library.

No matter where you upload an image on the site, it will always be added to the library.

Once an image is uploaded to a field, hover over the image and click the edit icon. This opens a box to edit the image details so that you don’t have to navigate to the media library. All field updates made here will save in the media library and across the site.

Image Sizes

Note that depending on where images are being used on a site, there are minimum dimensions that need to be hit in order for them to appear properly. If the uploaded image does not meet the cropped dimensions below, it may look pixelated or crop strangely. NOTE: the crop only occurs if the image size is LARGER than the dimensions listed below.

  • Hero (Homepage, Productions/Schools, and Pages) — 1440 x 800px
  • Column Blocks — 720 x 400px
  • Posts – 1440 x 800px
  • Bio — 260 x 260px
  • Testimonial (attribution photo) – 80 x 80px
  • Testimonial (background photo) – 1440 x 800px
  • Image Gallery — 720 x 400px
  • Large Image – 1440 x 800px