Inserting an Inline Image

Many of the content types have fields to add an image. This ensures the image is added in the appropriate spot for that content type. You can also add an “inline” image within the WYSIWYG editor.

  1. Navigate to the page where you wish to add an image. Click on the Edit tab. Scroll to the WYSIWYG area and put the cursor where you want the image to appear.
  2. Click on the Insert Image button in the WYSIWYG toolbar.
    Click the insert image icon
  3. In the window that pops open, you are presented with two ways to find the image.
    1. Next to Image, click [ Search ] to reveal the search box option. Enter part or all of the image’s System Name or select a recent asset from the history menu. When the file list appears, click on the correct file to select it. 
    2. Or, click the Browse button to open the pop-up dialog. In the new window, navigate to the image from your site's asset tree and click Confirm to select it.
      Browse for the image you want to insert
  4. The remaining pop-up window will show the path to and dimensions of the file. In the Alternate Text write a very brief description of the image. This alt text text will appear or be read to a person who uses assistive technologies.
    Fill in the alternate text

Caution: Only check the box next to This is a decorative image if the image does not provide informative content. A decorative image will be ignored by assistive technology. Photographs are not decorative images and require alternate text.

  1. Click Insert to add it on the page.
  2. Width/Height displays your image size in pixels. If you uploaded a properly sized image, these values should not be adjusted.

Most images should be aligned on the right. Unlike inserting images on the zeta templates, aligning the image should be done using the Styles dropdown, not the Advanced tab. For alignment, you can select align-right or align-left. Vertical and horizontal spacing (padding) is automatically added; any horizontal or vertical spacing you add will be removed when you submit the page.
Use align-left or align-right in the Styles drop down to align your image

Adding a caption to an image

There are two ways you can enter a caption for an image: using a field in a content type, or with an embedded image in the WYSIWYG editor.

Content types

The following content types have a field for a caption for each image.

Adding a caption to an image in the Editor

  1. Using the Editor content type, put your cursor where you want the image to go.
  2. If there is already text in the editor, hit Return.
  3. Insert the image.
    1. If the photo is the first thing you have inserted, highlight it and select Paragraph from the Format menu.
  4. Hit Shift + Return to insert a line break.
  5. Type the text for the caption.
  6. Highlight the text and select Caption from the Styles menu.
    Select Caption from the Styles menu

Note: If your text needs to be on two lines, type it all out in one line, format it as Caption, and then hit Shift + Return to break it into two lines.

  1. Click on the image and click the small p next to Path: at the bottom of the editor. This will select the image and the caption.
    Find the p next to Path on the bottom of the editor
  2. In the Styles menu, select Align-Right. This will pull the image and caption to the right side of the editor.
    Select align-right from the Styles menu

If you entered the photo and caption before any other text, hit Return, and then use the Clear Formatting tool to remove the Caption and Align-Right formatting. Then add content as you normally would.