Add Images

Demo: Image Sizes

You add images to the media library. You can access the media library two ways: 

  1. Using the admin menu: select Content > Media > Add media 
  2. Using the Content Editor: click the "Insert media" button in the content editor. (The icon resembles a photograph connected to a musical note.)
insert media button in the editor
Click to see a larger version

Adding/ selecting Images via Content Editor

  1. In the Body area and place your cursor in the content where you would like the image to appear.
  2. Click the Insert media button in the content editor.
  3. By default you will be on the Images tabs at the left.
  4. Upload a file to the Media Library: Under Add file, Click Choose File. Using the file browser, navigate to your file and upload. (Your file must be of one of the allowed types and less than the 24 MB limit.)
    1. Note: You may upload multiple files.
  5. When you add media to the library, you will have a form to fill out additional information.
    1. Alternative text: Images require alternative text for screen readers.
    2. Caption: (optional) You may add a caption to your image. Captions should not be the same as your alternative text. Captions are displayed on a page.
    3. Set Focal Point: It is best practice to set the image focal point upon initial file upload. This will save you time, if you ever use an image style that is cropped. Place the crosshair on the subject matter that you do not want cropped.
  6. When you have finished entering the required information, Click Save.
upload image
Click to see a larger version

Select and Insert Images

  • After you upload an image in the Media Library, it will be the first image listed and your new image should be selected, Click Insert Selected.
  • If you want to add an image that is already in your library you can use the filter option to search for it. Select the box for the image and Click Insert Selected.
Insert selected image
Click to see a larger version

Formatting an Image

  1. Image formatting options will display when you select the image.
    1. Image link: you may link the image.
    2. Override the alternative text: update or correct the alternative text on an image.
    3. Select an image style.
    4. Select text wrapping or not.
format image
Click to see a larger version

Watch Video