In-line images refer to any image added to the body field via the WYSIWYG editor as opposed to a specific file upload field such as "Teaser image".

Step 1

  1. Position the cursor where the image should be inserted.
  2. On the WYSIWYG editor, click the image button.

Select image button on WYSISYG

Step 2

The image properties window displays. Click browse server to select an image.

Select browse server on Image properties

Step 3

The file browser image folder displays. Select the image if it is already on the server (skip to Step 5), or click upload to upload a new image from your computer.

File browser upload

Step 4

The window to your computer opens. Navigate to the location where the image is stored.  

  1. Click on the image to select it
  2. Click open to upload the image.
    1. Mulitple images can be uploaded at one time. Select all images before clicking open.

Image upload

Upload finished displays if the image is successfully uploaded.

Step 5

Select the image by clicking on it. Click choose or double click the image to insert it in the WYSIWYG field.

Insert image

Step 6

The image properties window opens.

  1. Insert alternative text to describe the image for screen readers and search engines. This text doesn't display on the front-end, but is required for accessibility.
  2. Select the alignment of the image
  3. Select captioned image to display a caption below the image. The caption field will appear after OK is clicked.
  4. Click OK to save the image properties.

completed Image properties

You are returned to the body field to complete the rest of the content.