Adding an Image to a Page

1. Go to your site's /images/ folder, then to any appropriate subfolder. Click on the View Folder arrow to the right of that folder to enter that folder.

   • Being in the right folder first saves having to remember to do it from within the upload process.

2. At the top of the CMS, click the “ + Add Content” button.

3. Choose Upload Images.

4. The Placement Folder should show the correct /images/ folder. If it's not right, change the selection so it's in the right folder.

5. Drag and drop the image into the upload section, or select the image from your computer.

6. Edit the name if needed. Do not remove the file extension! (e.g., .jpg, .png)

   • Without a file extension, the image will not appear on the live site.

7. Submit the image.

You can now use the image on any page, event, or news post.

1. With your page open for editing, place your cursor at the beginning of the paragraph that you want the image to appear next to.

2. Click the Insert/edit image icon from the toolbar.

3. Click Choose File and browse for your file in Cascade. A list of your recently used images will display.

   1. Select the image:

      • Click the image's name from the Recent list, or

      • Click the Browse link to locate the image by its folder, or

      • Search for an image by its file name, and click the image name.

   2. Click the Choose button.

4. Edit the default Image description so it describes the image contents, including a copy of all text included in the image.

Image styles (float left, half-width, etc.) do not display in the editor. Select Show Edit Preview for a split-screen view while editing, or choose Preview Draft. (Cascade automatically makes images responsive, so their apparent size will adjust to display on mobile devices and different screen sizes.)

Style the Image

If the image is full-width, then no further editing for it is needed. But if the image will be half-width or smaller, then style it as follows:

1. In the Insert/Edit Image window, select one or more styles (e.g., float right and half-width). Holding down Ctrl/Cmd will let you select multiple options.

   • Float: Unless an image is full-width, it should always float right or left so the text flows next to it.

   • Width: You should also select the width of the image, so it appears as quarter-, third, or half-width on the page.

2. If you would like to add extra white space around the image, click the Advanced tab and enter the number of pixels in the Vertical space or Horizontal space fields.

3. Click Ok when complete.

4. Select Show Edit Preview for a split-screen view while editing, or choose Preview Draft in the upper right.

5. If the image looks the way it should, then choose Submit > Check Content and Submit.