By continuing to use this site, you agree to the storing of first- and third-party cookies on your device to enhance site navigation; analyze site, product, and service usage; and assist in our marketing and promotional efforts. Cookie Policy

 
Skip to Content

Images

OU Campus stores images as binary files in its file system along with pages and other types of files, like PDFs. Add images to your OU Campus site by uploading them. Once an image has been uploaded, you can add it to pages. Like pages, images must be published before they can be seen on your website.

Images share most of the same behaviors as pages. For example, you must check out an image to edit it. They also have the same file, review, and publish options. However, images have fewer access settings and properties compared to pages, and no source code editing.

Supported Image File Types: BMP, GIF, JP2, JPE, JPEG, JPG, PNG, SVG, TIF, TIFF

Images can be uploaded into image size sets, creating linked copies with predefined dimensions. 

Editing ImagesLink to this section

Edit images directly, as follows:

  1. In Content > Pages, find the appropriate image.
  2. Click More Actions More Actions icon.
  3. Click Edit > Image.
  4. From the Tools menu, specify the following:
    • Resize: Width and/or height, in pixels. Select the "Preserve Ratio" checkbox to keep the original proportions of the image. Click Resize.
    • Crop: Drag the dotted outlines around the image to define the cropped area. You can choose an aspect ratio for the crop; use "Custom" for the ratio to be unrestricted. Click Apply Crop.
    • Rotate: Click to rotate your image 90º to the right.
    • Zoom: Click + and - magnifying glasses, or type in a percentage, to zoom in and out on the image. Original returns the picture to its actual size. Zoom to Fit scales the image to fit the editing window.
      • This tool doesn't change the image, it zooms in and out to make it easier for you to edit.
    • Undo: Click to undo your last change.
    • Redo: Click to redo the undone change.
      A screenshot of an interface for editing images. Tools are "Resize," "Crop," "Rotate," "Zoom," "Undo," and "Redo."
      The interface for editing an image.
  5. Click Save or Save As (to save a copy of the original image with the changes you made).
  6. Publish the image to make the changes visible on your live website.

You can also choose to upload and edit an image.

Additionally, you can edit an image from the "Select Image" file chooser:
A box showing the "Select Image" file chooser, an orange arrow points to a link that says "Edit Image"

 

Is a recently-uploaded image not displaying on your page? Make sure you publish the image!

Updating Images on PagesLink to this section

An image can be edited after it's been placed on a page or pages. Once the image is published, any pages with that image are automatically updated to show the new image.

Once an image has been added to a page, it can be swapped out for another, as follows:

  1. Right-click the image and select "Image" from the menu.
  2. Use the "Source" filechooser to select a new image, and click Save.
  3. Republish the page and clear cache if necessary to see the updated image.
    • If the new image was not previously published, select the "Include Unpublished Dependencies" checkbox on the page Publish box.

Another way to swap images on a page is to upload the new image and overwrite the old one. The new image must have the same name and extension and be uploaded to the same location as the old one. Publish the new image to your live website, and it is automatically updated on any pages containing the old one. You may still want to check those pages, however, in case the old image had styling or proportions applied that interact strangely with the new image.

Not seeing an updated image? Clear your cache (the images and styling that your browser stores to reduce page load times). A hard refresh (Ctrl+F5 on PC, Cmd+Shift+R on Mac) also reloads the image.

Binary Management

If you have binary management turned on, then your images are tracked by dependency tags. This means that when an image is renamed or moved, any pages containing that image are automatically updated so the image doesn't break. If an image is deleted, it's treated as a broken link in link check and the broken pages report.