The Image Editor allows images to be resized, cropped, rotated, and zoomed directly within OU Campus. Images can be uploaded and edited all in one operation. The edited image must be republished in order to appear correctly on the rendered webpage.
Please note: we recommend resizing images in Photoshop rather than OU Campus to allow for optimization for the web.
Accessing Image Editor
The Image Editor can be accessed using the following methods:
- Clicking on a linked image name within the Pages List view
- Clicking Upload and Edit from the Upload modal when uploading an image in the Pages List view
- When inserting images into an editable region from the Insert/Edit Image file chooser while in the WYSIWYG Editor
Editing functionality available includes:
- Resize: See the Web Style Guide for appropriate image sizes; remember to hit the resize button after editing
- Crop: Drag the image handles to set the crop area, remember to hit the Apply Crop button after editing
Resize an Image
The Resize tool includes the ability to specify a new width and height for the image.
The original ratio for the image dimensions can be kept intact by selecting the Preserve Ratio checkbox.
Cropping an Image
The Crop tool can be used to crop the image, either by selecting a predefined aspect
ratio or by determining a custom crop size. When Custom or any of the predefined ratios are selected, a crop box will appear. You can then
adjust the crop for the image by dragging the crop handles located on the edges of
the crop box. Clicking the Swap width & height checkbox will swap the dimensions of the crop box width and height (e.g., a crop
box with dimensions of 150x300 pixels would swap to 300x150 pixels).
Rotate an Image
The Rotate tool rotates the image 90 degrees in a clockwise direction with each click.
The Undo and Redo functionality is available after performing another editing function. Undo reverts the last function performed (one level back). The Redo function reapplies the last function removed by the Undo tool (one level forward).
Tip: As a best practice, crop or resize images outside of OU Campus to the exact size needed
on the page before uploading to your image folder.
Tip: The Web Style Guide includes appropriate image sizes for rows and columns.