Skip to Content
Try Prodio for free

Banner Step

A banner is a floating card that appears in the corner of the screen. It is typically used to announce new features without interrupting the user’s workflow.

General Properties

Title

Bold text at the top of the banner used to introduce the step. Supports HTML.

Body

Main content of the banner used to provide more information about the step. Supports HTML.

Position of the banner on the screen. You can choose from the following options:

  • Top left
  • Top right
  • Bottom left
  • Bottom right

Hide Close Button

If enabled, the close button will not be shown in the banner. This can be useful if you want to force the user to interact with the banner before continuing. Use this option with caution, as it can make the onboarding experience less user-friendly.

The footer properties allow you to customize the footer buttons of the banner.

Wait

The wait properties allow you to control what the banner should wait for before continuing to the next step.

Advanced

Step ID

Unique identifier of the step. This is optional but can be useful for programmatic control of the workflow.

Custom z-index of the banner. This can be useful if the banner is not displayed correctly because of the z-index of other elements on the page. The value is applied only to the step where it’s set.

Defaults to CSS variable var(--workflows-zIndex) from the style template.

Last updated on