Message

A message is a popup that can be displayed at the top of your page.

Once you’ve added your message element, click “Edit Message”.

Often, you need to add interactions to manage opening and closing message.

A popup area will appear. Next, drag in other elements, such as text, to build your message.

Properties

Type: Select a message type. This option styles your message's background color based on the colors set in your theme. Options include: success, warning, info, error, or custom.

Duration: Specify how long the message will be displayed on the screen.

Offset top: Set the distance (in pixels) from the top edge of the screen.

Show close icon: When toggled on, users will be able to close the message manually.

Z-index: Set the z-index of the message. It is used to ensure that the modal is displayed on top. See CSS doc for more details.

See Tooltip for tooltip configurations.

Displaying a message

To trigger the message popup, set up an interaction on another element, such as a button.

Here is an example for a button click to trigger the message popup.

Use interaction to show a message

Supported Events

Close Message: Triggered when a user closes the message.

Supported Actions

Show Message: Display message on the screen.

Close Message: Close message.

Set Data: Change element data. See Data Store.

Set Loading: Set loading animation. See Set loading animations.

Visit Interactions for more on events and actions.