Skip to content

Tours and Highlights ​

Tours and Highlights add contextual guidance to the product pages where customers already work. Both use the Managani widget installation and signed customer identity.

Tours ​

A tour is an ordered set of steps. Each step targets a CSS selector and shows a title and description in a positioned popover. Steps can advance from the tour controls or when the customer clicks the target element.

Use page rules, customer segments, and show-once behavior to limit eligibility. Enabled tours can start automatically when their page rules match or manually by key from your application.

Highlights ​

A highlight points to one CSS selector. Configure its popover position, alignment, delay, priority, page rules, audience segments, and show-once behavior. Highlights can also be manual, drawer-aware, or modal-aware for interfaces that do not exist at initial page load.

Move Configuration Between Sites ​

Both sections support JSON export and import. Export before making large changes or use the files to move a reviewed configuration between environments.

Selectors must be stable. Prefer application-owned data attributes over classes generated by a framework or build process.

Design Guidance Around a Real Task ​

Use a tour when the customer needs to complete a sequence, such as finding a settings page and configuring a feature. Use a highlight when a single control needs explanation. Each message should describe the next useful action rather than repeat the label already visible on the screen.

Check every selector on the pages and interface states where guidance may appear. A target inside a closed drawer or modal needs the appropriate display behavior; a selector that changes between builds can leave a step pointing nowhere. After a product layout change, revisit the affected guidance before relying on it for onboarding.

Test with a signed customer who matches the intended segment. Walk through each step, including steps advanced by clicking the target. Confirm that page rules prevent the guidance from appearing in unrelated areas. Export a reviewed configuration before larger edits, and verify imported configurations against the destination site's own pages and selectors.