Widget Library

Image

Quickly place an image onto any of your website's pages.

This widget allows a user to place an image without using the HTML WYSIWYG by either letting a user select an already uploaded image or upload a new image using the File Manager.




How do I add this widget to a page?

  1. Click Edit Page
  2. Click either + Content or the Settings icon (down-facing caret) which will be located to the right of Edit where you will need to select either Insert above or Insert below
  3. Choose the Image widget
  4. Select or upload a new image, click in the image box, and navigate to the proper directory. We recommend creating an Images folder if there isn't one, to make file management easier. There you will be given the option to upload an image or a selection of photos.  If a list of images is displayed, select the size you want to use. If you choose the + sign to the right of the image, it will be the non-optimized version of the image.
  5. Additional fields can be found in the Settings tab, these will allow you to customize what information the widget displays. The fields and their descriptions are listed below;
    • Alt Tag - Enter an ALT tag. We recommend entering an ALT tag for ADA compliance.
    • Style - Choose the style of the corners. Options available are the default (squared), rounded, and round.
    • Border - Should the image have a border? The default is off
    • Alignment - Choose the alignment of the image inside the container. Options available are Left, Center, Right, and Top.
    • Link - Enter a URL if the image should be a link.
    • Caption - If you would like a caption for the image, enter it into this field.
  6. When you are finished, click on the green Create button and your Image widget will show up on the page. 
  7. Make sure to click either the Publish or the Save Draft option just as you would when you're editing pages.

Note: It is important to avoid using the Image widget to place PDF files. PDFs are not compatible with the Image widget as they are not image files. Instead, they should be either linked to or placed on the page using the instructions provided in the following article: How can I make a PDF viewable on a page so it doesn't need to be downloaded? This will ensure proper functionality and display of PDF files on your website.