Image Editor Overview
The Image Editor allows images to be resized, cropped, rotated, and resized with zoom directly in the OU Campus system. Images can be uploaded and edited all in one operation. The ability to edit an image helps ensure large images are properly resized before being transferred to the web server. Additionally, images can be saved and renamed. The Image Editor can be accessed using the following methods:
- Within the Pages list view by clicking a linked image
- Within the Pages list view by clicking Upload and using Upload and Edit
- While inserting images on a web page using the WYSIWYG Editor > Insert/Edit Image dialog
- When editing or creating a new Web Content Asset, the mini-WYSIWYG Editor > Insert/Edit Image dialog
- While inserting images on a page using the Source Editor
LDP Image Galleries are another way users can add images to a site in the OU Campus system. However, this function is not related to the standard Upload and Edit Image feature and requires that Live Delivery Platform (LDP) be enabled.
Image file types support by the Image Editor is browser dependent. The following file types commonly used for web pages can be edited and saved with the Image Editor with the most commonly used browsers:
For a complete reference of browser support for image formats, see:
Image Editor Restrictions and Requirements
The image size is dependent on two factors, the browser and the amount of memory allocated to the browser by the parent machine. In testing a fairly large image, 13260 x 3955 pixel (27 MB), was used and rendered in 198 ms. Performance of image rendering is dependent upon each individual user's machine and Internet connection. In short, every time a user tries to load an image, large or small, jpeg or any other extension, the image editor relies on the browser to provide the pixel information.
If working with an image that cannot be edited, log out of OU Campus, quit and relaunch the browser. This will free up browser-allocated RAM and may resolve the issue.
If pictures do not update to the edited version in Preview mode, the Image Editor and web browser might be clashing. A browser stores copies of pages of visited pages, then displays these stored files upon the next visit. This way, the browser is not being forced to load the page anew with each visit, which takes more time than viewing a stored copy. This storage of pages is called a cache. However, this cache can sometimes pose a problem when viewing the most updated version of a page is needed. Clear the browser's cache to ensure viewing of the most recent versions of a page. Reloading or refreshing a page in a browser is usually sufficient and there are more invasive method of clearing all browser data in each browser's settings.
Image Editor Tools
The Image Editor has a predefined set of tools that allow users to customize images as they wish. For more information about the tools available in the Image Editor:
Image Editing on Upload
Images imported into OU Campus can be edited on import. To edit images when importing:
- Click the Upload icon in the Pages list view.
- In the Upload dialog, select Upload and Edit Image.
- This automatically opens the local computer’s File Explorer (PC) or Finder (Mac). Locate the file and click Open.
- The image is opened in the Image Editor where changes can be made to the file.
- When all the changes have been made, click Upload.
- A dialog will appear. Enter the New File Name for the file, including the extension, and use the browser to Select Destination Folder. If needed, select the checkbox for Show Files.
- Click Save. The user is returned to the Pages list view inside the folder where the image was uploaded.
Image Editing from Pages List View
Any image file can be edited from the Pages list view. The image editor can be used to edit images already uploaded to the staging server.
- Navigate to the Pages list view by selecting Content > Pages from the global navigation bar.
- Hover over the target row and click Edit, or click the hyperlinked image name.
- The Image Editor will open and the image can be modified.
Editing Images in WYSIWYG Mode
To edit any image while using the WYSIWYG editor, click the Insert/Edit Image icon in the WYSIWYG toolbar. Any image can be selected and edited using the Edit Image button in the file selector window. Additionally, users can upload and edit any image from this same window by clicking the Upload button.
- Click the Insert/Edit Image icon on the WYSIWYG toolbar.
- Click the Browse icon to change or edit an image.
- Expand a folder or double-click to view thumbnails of all the images contained within
that folder. Click a thumbnail to show a preview of just the selected image.
- Choose one of the following actions:
- Click the Edit Image button to edit the file displayed in the Image Preview window.
- Click the Upload button to open, edit, and upload a file from a local computer.
- Click the Upload & Edit button to upload a file from a local computer and start the Image Editor.