1. From the Edit Page view, click Add to Content then click Add Block.

  2. From the Add Block window, select Image.
    screenshot of the image block highlighted

  3. Click Image to add an image. See how to add an image from Flickr.
    screenshot of Add Image with the image option highlighted

  4. Choose +Select an image to open the File Manager.
    screenshot of the add image form with the Select an Image button highlighted

  5. The File Manager displays images that have been uploaded and also allows uploading new images.
    • To search for an existing image, use the Keywords search box to search for a specific image or select the Next button to browse through the uploaded images.
    • To upload an image, select the Choose Files button and browse to select the image. Select Upload File to add the image to the File Manager.
    • With the image in the File Manager, click the image and select Choose from the pop-up menu.
      screenshot of the file manager with the keywords, choose file, upload file, chose image, and next button highlighted

  6. The Add Image form will reappear displaying the image. Complete the remaining fields and then select the Next button.
    • Image Alignment: Select how the image should be aligned on the page. See How do I align an Image block? for additional information.
    • Alt Text:* Describe the image by telling viewers as much as possible about the image using as few words as possible. The purpose of alternative text is to allow the content or purpose of the image to be available to someone with visual or cognitive disabilities. Alt text is only visible to those with screen readers. To learn more about alternative text visit http://webaim.org/techniques/alttext/.
    • Image Caption: Add a caption to the image which will be displayed on the screen for all viewers. 
    • Link: If the image should link to another page, enter a URL.
    • Image Attribution: Use these fields to attribute the image to the author. 
    • Zoom Image?: Check the Yes box if the image should open at its original size in a new window.
      screenshot of the Add Image form completed showing the image selected, alt text, alignment, and caption completed

  7. Use the Numeric Resize: field to change the pixel width and then click Size; or click and drag the corners of the image to resize manually. Select the Add+ button.
    screenshot of the resize screen with the numeric resize field and add button highlighted

  8. The new Image block will now appear on the page in the Edit Page view. Select the Publish My Edits button to save the block to the page.
    screenshot of the image as a new block on the page in the edit mode

  9. Once the changes are published, the Image block displays as it will appear to the end user.
    screenshot of the image on the page as it will appear to the end users centered and showing the caption



To learn more about working with images, watch our video Working with Images from CourseArc on Vimeo.