Adding images

Adding images via the WYSIWYG

  1. To add images to your content type or block via the Body WYSIWYG, click on the Image icon Insert media from library
  2. This will bring up the Add or select media dialog box:
    Screenshot of the Add or select media user interface
  3. From this interface, you can select and insert existing images via the gallery or upload a new image using the Add file » Choose File button.
  4. USING AN EXISTING IMAGE IN YOUR GALLERY:
    1. Scroll through your gallery or search for it using the Search/Filter option to locate your desired image.
    2. Click its checkbox located in the image's upper lefthand corner.
    3. Click the Insert selected button which will then return you to your content view.
  5. UPLOADING A NEW IMAGE FOR IMMEDIATE USE:
    1. Click on the Add file » Choose File button.
    2. Select the image from your local system or cloud service.
    3. When you return to your site you will be asked to provide the following information, asterisks denote required fields:
      Sceenshot of the Add or select media fields.
      Field elements:
      • Alternative text - this text has multiple purposes; it is required to meet accessibility requirements for visitors to your site who use a screen reader, and the text will appear instead if the link to the image is broken.
      • Name - the file name including the file extentions (.png, .jpg, etc)
      • Caption - text that will formatted to display beneath your image. Captions added here will be available for use both through the WYSIWYG interface as well as image attachment locations, such as primary images or photo galleries. Specific documentation on media captions.
      • Category - an optional tagging system to help you organize your images. For your internal use only; image categories will not be visible to your visitors.
      • Focal point - located on the left side of the screen allowing you to use the crosshairs to select the point of focus when displayed to make that part of the image always visible in its location.
  6. Click Save to continue and you will be returned to your content.
  7. Once your image is in the Body WYSIWYG section you'll notice the presence of the Edit media button:
    Screenshot showing an image's Edit media button.
  8. Edit media provides you with this interface:
    Sceenshot of the Edit media interface
    By default, the Caption checkbox won't be set. So use the Edit media option to enable it. Once enabled, you can choose to edit it from the regular content View. Please note your caption changes on the page will not affect the original caption saved in your Media Library.
  9. Display offers a series of width presets:
    Screenshot of the media display presets list
    Width definitions:
    • Default - the static size of the image you uploaded. Not responsive to changes in screen width.
    • Landscape 16x9 - 1280x720px
    • Landscape 4x3 - 640x480px
    • Large - image displayed to a max of 1000px *
    • Medium - image displayed to a max of 500px *
    • Profile - 520x580px
    • Small - image displayed to a max of 200px width *
    • Thumbnail - 135x135px
  10. Click on Save and Keep Published or Save and unpublish.

Add a Primary Image

  1. Locate the Primary Image section of your content type if it's available:
    Screenshot of the Primary image upload fields.
  2. Click on Choose File and select an image from your local computer. File size is limited to 3MB or smaller; anything larger will trigger a warning message and not allow you to save your work.
  3. Once the image uploads, you will see these options:
    Primary image setting options
    Alternative text - (required) This text will be used by screen readers, search engines, or when the image cannot be loaded.
  4. When complete, scroll to the bottom of the screen and click your preferred Save option.

Tags

Images