Images and Media in T4

High-impact, beautiful photography is a large component of the St. John Fisher University website. When using images on the web, keep the following guidelines in mind.

Image Dimensions and File Sizes

To provide our users with the best experience possible, we need to balance photo quality and image size carefully. Use the following target file sizes as guidelines when uploading images. If you need help getting your images down in size, we recommend using Optimizilla. The website allows you to easily upload images and use a quality slider to reduce the file size without compromising clarity. A quality score of 75 is generally a safe bet.

Uploading Images to T4

All images should be added to the Media Library in an "images" folder in your section. The Media Library is located under the Content tab in the menu. Once in your images folder, you can add a new image with the + Add media button.

About the Media Details Screen

Use the "Drop file here or click to choose" button to select your image. You will then see a preview of your image in the Media file field, as shown below.

• (1) The Media type field will automatically populate with the appropriate designation.
• (2) The Name field is required and should be a descriptive name of the image.
• (3) The Description field should be filled out with a short summary of what the image is portraying. This text will be used as the "alt text" of the image. When writing a description, imagine you are explaining the image to someone who is not looking at it.
• (4) The Syntax highlighting language field will automatically populate with the appropriate designation.
• (5) The Media language dependence field should be set to "Fully independent."

Note: The filename of the image you're uploading should not contain spaces or special characters.

Adding an Image to a Page

The following training video will walk you through the steps of add an image from the Media Library to your page using an image layout [Video Length: 00:02:18].

Follow the steps below to add an image to your page.

• In the WYSIWYG field, place your cursor on the line of text that you would like to align with the upper edge of your image. The cursor must be all the way to the left.
• From the WYSIWYG, select the mountain picture icon.
• Browse to your images folder and find the image you'd like to insert.
• From the Actions dropdown menu, choose Select with layout.
• Choose your desired layout - refer to the Image Layout Examples page for information on available layouts.

Note: If you are using a layout that includes a caption (text/quote-top-image, text/small-image, or text/wide-image) you have to edit the caption through the Description field in the Media Library; it is not editable directly through the page.