Image widget

The Image widget allows you to add static and dynamic images to a page.

Examples

Use this widget to support app design requirements such as the following:

• You want to add supporting images to a page that visualizes or corresponds with the represented topics or data.
• You want to show an image on the home page that users can click to be redirected to another website.

Usage notes

For a static image source, there are no limitations to the number of images you can upload.

Settings

The Image widget includes the following settings:

• Connect to data—Optionally, connect the widget to specific data, including a data view. (A data source is not required for an Image widget.)

• Image source—Select an image source by either uploading it from local files or providing the URL. The widget supports https and base64 URLs. If applicable to the selected data, click Dynamic and choose Attachment or Symbol to populate the image widget with feature layer attachments or web map feature symbols. Click the Delete button to remove an unused uploaded image.

  • If the selected data view contains multiple features, the Image widget only displays the attachments or symbols for the first feature.
  • The Attachment and Symbol source support data view selection, Selected features, or Auto-populated features (with List).

• Set link—Add a link on the image to go to other content, such as a page, window, web address, block, or a view in a section in your app. In addition to a web address, you can use the URL option to set a link to go to an email address, phone number, and more. You can choose whether a link opens in the same window as the app, the top window, or a new window.

• Tooltip—Provide hover text to describe the image.

• Alt text—Provide the alt text for assistive technology, such as screen readers.

• Position

  • Fill—Fill the widget area with the image, leaving no blank space, but the image may be cropped.
  • Fit—Fit the entire image within the widget borders.

• Shape—Change the image shape from rectangular to other options such as circular and hexagonal.