Add Photos

There are several ways to add photos to your page:

Photo Gallery | Content Area | Page Feature | Content Block

Photo Gallery

CMS users can upload one or more images to this feature directly from their computer. Please note that copyright laws apply, meaning you must have written permission to use images before uploading to the university site--attributing the image to its original source does NOT satisfy legal requirements. Users also have the ability to choose images from the web server folders

Adding a single image will display that image right-justified inline with the text near the top of the page content area. If you choose multiple images, a photo gallery will be displayed at the top of the page, below the Page Header and Page Intro but above the Page Content.

The format of the Photo Gallery is always the same, with one full image showing and part of the next image showing with an arrow to click through the images. Clicking on any image pops it up in a "lightbox" where you can click through the images. This is also where you would see any captions for the images in the photo gallery.

If you upload images that are larger than the photo area, you will be prompted to crop these images when you save the page. Large horizontal images work best. The smallest size for photos uploaded to the Photo Gallery is 524x348. Be sure you are using images that we have legal rights to. No "borrowed" Web images, and attributing the source does NOT alleviate copyright requirements.

  1. Find the page you want to add photos to in CMS, edit it, and scroll down to the Photo Gallery section.
  2. If the image you want to use has already been uploaded previously, click the Browse button. 
  3. Navigate to and select your desired image and then click Use Selected Image. Note that only image types will be displayed (JPG, PNG, GIF; PDF is not an image type--any PDF would need to be converted to an image file type to be used in an image field), and any image that doesn't meet the minimum size requirements won't be available for selection. 
    Note: You can also UPLOAD images through the browse interface. Upload images through this option if you want them to be available for other pages or elements.
  4. Selected images will by default have their filename added as the caption, so you will need to edit the image tile in the Photo Gallery and modify the caption.
  5. If you need to upload a new image, make sure the new image meets the minimum image size (524x348). Then click the Upload button. Images uploaded via the photo gallery element are ONLY available for use in this photo gallery on THIS page. If you want to use an image in multiple locations, you would need to upload it through the BROWSE interface referenced above.
  6. Navigate to and select your image.
  7. Enter a caption in the Image Caption field window that appears.
  8. The pending thumbnail appears and will be processed when the page is saved. You will have a chance to crop the images you've added at that time.

You can reorder the images in the photo gallery by dragging and dropping them, but they do not randomize and they do not auto-rotate.

Content Area

There are some places in the CMS where you can upload your photos and the system crops them to the specified size, and there are other areas where the size is not predetermined. Adding images inline with the content in the Page Content field is one of those areas where the photo is not cropped to a particular size for you.

Why might you need to add a photo to the content area instead of using the Photo Gallery option? One reason could be that you don't have a large enough photo to use the Photo Gallery feature. Another could be adding images that are referenced directly in the text.

  1. Find the page where you want to add the photo in CMS to and edit it.
  2. Place your cursor in the Page Content area to the left of the line where you want to insert your image. 
  3. Click the Insert/Edit Image icon in the formatting toolbar.
  4. Click on the browse icon to the far right of the Source field. 
  5. Move to your department folder where you will have permissions to upload images.
  6. Upload a new image by clicking the Upload Files button near the top of the window. Click the Upload button. Navigate to and select the desired image to upload.
  7. Navigate to and select the desired image and then click the Use Selected Item
  8. You may have an option to use the Small, Medium, Large, or Original image. Err on the slightly larger size than you think you need, as the image will be reduced to that size on your page, so you won't be able to size up past that reduced size.
  9. Use the Class field to determine if you want the image on a line above the text (default), aligned to the left with the text wrapped around the right (align left), or aligned to the right with the text wrapped around the left (align right). Note that the Align Right option will appear that it isn't working in the edit mode, but when you preview or publish the page, the photo will be aligned to the right.

Page Feature

The optional feature box appears at the top of the page. You must enter photos for this feature to look right. Large horizontal images work best for this space. If your image is too large, the CMS will prompt you to crop the image when you save the page. See the How do I add a Page Feature page for details on using this feature space. 

Note:  In the mobile and tablet view, the rollover text appears on top of the screened back image. Since over 25% of our general site traffic comes via mobile devices, it's important to always consider how the pages we're developing will look on mobile devices.

Content Block

Content blocks appear at the bottom of the page, below the page content. These color boxes of text CAN have an image at the top of them, as seen on the library landing page. As with other specified photo spaces in the CMS, the photo will be cropped horizontally. The minimum image size is 402 x 260. However, the flexible content block callout does NOT have to have an image to function or look correct.

Images uploaded into a flexible content block callout are only available on that particular page in that particular page element. However, users can also opt to browse existing web server folders to use a previously uploaded image for this page element, or to upload an image that can be used on this page as well as others.

As always, any images used in this or other spaces must be used with permission. Neither our nonprofit status as an educational institution nor attributing the source of borrowed images exempts us from copyright law.