Image element

In this Article

• Image element settings
• List, Grid, and Slideshow formats

The Image element displays a single image from Resources and is an ideal element to use because any image inside of an Image element will automatically fill the width of the container the element is displayed in. Moving to a wider space means the image will stretch to fill without any adjustment. Returning to a smaller space automatically resizes the image to the new constraints.

To insert an Image element onto your Composer page, open up your Element library to the "Standard" elements and select "Image."

Image element settings

In addition to the common element settings, the Image element includes the following configuration options.

• Browse: Use this button to search for a specific image within Resources and select it to display in the element.

All

• Display Resource: Choose to display the filename or the title of the image, or none.

• Display Title: Choose to display the title of this image either above or below the resource.

• Description: Display the description of the resource in the element display.

Image

• Alt text: Alt text is a written description of the file for screen readers and other assistive technology, and it is required on images by current ADA standards. Enter custom alt text here to override the alt text set in Resources.

• Caption: Select "Default Description" to display the text from the “Description” field for the image in Resources, or "Custom" to use a custom caption. 

Advanced

• Ignore URL Parameters: If this option is selected, the resource displayed in the element by default will remain even if user-selected criteria would normally override it.

Link to

• Link Resource: Select this checkbox to allow users to click on an image and be taken to one of the following options.
  • Popup: Choose this option to open the resource in a lightbox, with the rest of the screen dimmed.
  • Internal Page: This option will link the image to a site page, which you can choose using the "Select Page" button that appears.
  • External URL: Link the image to an external web page. Enter the URL (starting with http:// or https://) in the field below.
• Open in a New Window (Internal Page or External URL only): Select this checkbox to have the link open in a new window or tab.

Design

Scroll down to view the Design controls. This is a great place to add content or buttons into the "Header Content" and "Footer Content" areas that will display tightly with each element.

List, Grid, and Slideshow formats

Note that the Image element can also be used in a List, Grid, or Slideshow format, which functions the same as the Resource element. Refer to the Resource element article for more information about these settings.