Upload an image

Upload an image from your desktop to your page.

This guide demonstrates how to upload an image to your page using the WYSIWYG editing toolbar.

Step by step

To upload an image:

  1. Select the image link icon from the WYSIWYG editing toolbar.


     
  2. The "Add or select media" window will appear. You can either upload your own file or choose from the image library, which consists of media materials uploaded by the HMS Web Team (complete with alt text) and media you have previously uploaded.  
     
  3. To upload your own file:
    1. Select Choose File.
    2. Select an image from your desktop.
    3. The image will appear. Enter alternative text for the image. If needed, review DAS's helpful hints for writing alt text for images.
    4. Select Save and select to save the image to your image library. This will lead you back to the "Add or select media" window. Select Save and insert to insert the image directly into your page.

  4. Your image will now appear on the page. Select the top arrow to enter a space above the image. Select the bottom arrow to enter a space below the image.

    Enter space icons highlighted on image.

  5. Use the image toolbar to edit the image:

    Image toolbar with icons labeled.

    1. Caption - Select the rectangle with a line icon (furthest to the left) to toggle on a caption.
    2. Link - Select the chain link icon to link the image. Enter the URL destination. If desired, enter a title. Then, select the green check.
    3. Alternative text - Select the eye with a diagnal line icon to edit to the existing alternative text. Mark the image as decorative or enter new alternative text in the "Alternative text override" field. Then, select the green check.
    4. Re-size - Select the Editor drop-down menu and select your desired size.
      1. Editor Full - Image will become full (largest).
      2. Editor Large - Image will become large.
      3. Editor Small - Image will become small.
      4. Thumbnail - Image will become a thumbnail (smallest).
    5. Alignment - To realign the image:
      1. Break text - Select the first icon to have the image left-aligned with text above and below the image.
      2. Align left and wrap text - Select the second icon to have the image left-aligned with text wrapped to the right of the image.
      3. Align center and break text - Select the third icon to have the image centered with text above and below the image.
      4. Align right and wrap text - Select the second icon to have the image right-aligned with text wrapped to the left of the image.