Upload images to the WordPress Media Library of a department subsite or the shared Calendar of Events, Directories, News, or Scholarships subsites for the University of Southern Maine public website.
How-to
What do you need help with?
Overview and guidelines
The best way to size your images properly for WordPress is to start with a template and resize your image to best fit within the template's bounds.
If you don't have access to Adobe Photoshop (or another program/application that can read .psd files), we recommend using a free in-browser tool called Photopea to resize your images and save them as .webp files that are about 100KB in size.
In the table below, you'll find image sizes listed by the Pattern or Block name, image dimensions (in pixels), and links to download a .psd template file to use in either Photoshop or Photopea.
INFO: If you're updating a Pattern you've previously placed on a page of your subsite, you may need to replace the old Pattern with the latest version from the Pattern Library. We're constantly working to improve and streamline our Patterns.
The last Pattern Library update was July 2025.
INFO: Click on an image thumbnail to see the full-sized version.
Step 1: Log in to WordPress
Begin by logging into WordPress with your maine.edu credentials. Use the "My Sites" menu in the upper left corner of your screen to find the subsite where you want to upload an image.
The example pictured is for the Calendar of Events subsite; make sure to click the Dashboard link for the subsite where you will use the image.
WARNING: You cannot select images from another subsite via the Media Library. You'll need to upload the image to each subsite you want to use it on.
Step 2: Open the Media Library
From the subsite Dashboard, choose the "Media" link from the left-hand menu. The example pictured below is for the Calendar of Events subsite.
Step 3: Upload your images
WARNING: Text in images is not accessible. Screen readers cannot "see" text within an image file. Instead, add that information as text on the page where you place the image.
Drag and drop your pre-sized image files into the box with a dashed border. Alternatively, you can click the "Add Media File" button or the "Select Files" button to navigate through the folders on your computer and select your image files.
Step 4: Assign a media category to your images
INFO: At least one image must be selected for the media sidebar to appear.
After uploading your images to the Media Library, assign the appropriate Media Category to each one. You can assign more than one Media Category to an image. This allows you to use the "Filter by Media Categories" function to find your images again later.
The example pictured is for the Calendar of Events subsite, and the Office of Student Engagement & Belonging is selected. For shared subsites (Calendar of Events, Directories, News, or Scholarships), select the Media Category for your specific department or office. Don't select the department in the pictured example unless you represent the Office of Student Engagement & Belonging.
For department subsites, Media Category options help you organize your images by size or Pattern, making them easier to find via the "Filter by Media Categories" function. Categories include:
- Featured: Page header
- Full-width image
- Gallery block
- Info block: Narrow
- Info block: Wide
- Inline image block
- Testimonial headshot
Step 5: Add alt text
If you have more than one image selected, click the Deselect button below the last row of visible images. Then select the thumbnail for an image you just uploaded.
In the media sidebar, enter a succinct description of the image in the Alt Text field. The text will auto-save when you click out of the field. Learn how to craft the best alt text for your images from WebAIM.
After you add alt text to your image(s), you're done! Go to the page where you want to use the image(s) and follow the prompts to select your newly uploaded image(s) from the Media Library.