Media

In this section, learn how to add images, documents, and remote videos to your website. 

Media is uploaded to a media management tool on the site. The Media Library enables you to find media that exists in your site and to add new media items. It allows you to search, sort, and create media items with a robust interface. Media items can be directly added to a field (e.g., member profile picture), or embed into your content via the WYSIWYG text editor. 

Updating a media item in the Media Library will update all references to that media item. For example, editing the Wilkinson Building image/media item by removing the current image and updating a seasonal one will update the image on all pages where the images is being used. So, you can manage all media on your site in one location - the media library. 

Media Library Tutorial

By the end of this tutorial, you should have a better understanding of the Drupal media library and how it's being used in our websites to manage images, documents, and remote videos. 

Optional Image Sizes

The following image guide provides recommended image sizes. All dimensions are in pixels (width x height). Photos should be saved in .jpg format using 70% compression.

Images can be edited using Adobe Photoshop or another photo editor of your choice like photo. A free photo editor option is fotor.com.

Image TypeRetina (WxH)Standard (WxH)Preferred RatioPreferred Orientation
Homepage - Full Screen Width Hero2500 x 10001250 x 5002.5:1landscape
Page Hero - Full Content Hero2450x8001225x4003:1landscape
Content Body  4:3 or 3:2 ratioslandscape
Profile Headshot400 x 400200 x 2001:1square
Image Slider (Gallery slideshow)1600 x 900800 x 45016:9landscape