Images Gadget

Home  >  OU Campus Self-Help  >  Gadgets  >  Images Gadget

The Images Gadget is a sidebar gadget that gives users the functionality to drag and drop images previously uploaded from the Gadgets sidebar into an editable region when using the WYSIWYG Editor. This gadget is useful in that it helps streamline the process of adding images to pages. Images can also be dragged to a local computer from the Images Gadget. PLEASE NOTE: Make sure you resize your image before dragging and dropping the image on you page.

The Images Gadget is shown on the Gadgets sidebar after an editable region within the WYSIWYG Editor. The functionality available with the Images Gadget includes:

  • Viewing the images as thumbnails. Use Select New Location to specify the directory from which to show thumbnail previews.
  • Viewing a larger preview of an image by double-clicking it. The file name is shown in the preview.
  • Inserting an image from the preview by clicking the Insert button.
  • Dragging an image onto the editing area to insert it on a page.

Selecting the Images Folder

Images can be chosen from the production server or from the staging server. Images must already be uploaded to the location in order to be accessed via the Images Gadget.

  1. Click the Select New Location linkselect new location
  2. From the Select an Image Folder dialog, select Staging or Production. If necessary, select the Show Files checkbox to find the files in the folder.Show Files and Staging
  3. Click Select. Choose a directory within the OU Campus system that contains the images by clicking the Folder icon. Additionally, clicking on the linked text in the Images Gadget will accomplish this action.

Adding Images from the WYSIWYG Editor

  1. If the Gadgets sidebar is not visible, click the Show Gadgets icon to show the sidebarShow Images Gadget
  2. Expand the Images Gadget using the expand iconImages Expanded
  3. Choose the image from the available thumbnails.
    Add the image using one of two methods:
    • Drag the image onto the WYSIWYG Editor
    • Click the image's thumbnail in the Images Gadget. From the preview of the image, click Insert and the image is inserted at the location of the cursor. Select ImageImage in the WYSIWYG