Skip to content

Product tours ​

A tour is a series of steps that point at elements on your page, or show a modal or banner. Visitors move through it with Next and Back.

Create a tour ​

  1. In the dashboard, open Tours and create one.
  2. Add steps. For a tooltip step, pick the element it points at.
  3. Set targeting (who sees it, on which pages).
  4. Publish.

The SDK fetches published tours on init() and plays the ones that match the visitor.

How steps are shown ​

  • A tooltip step highlights the element found by the step's selector.
  • If a step's element is not on the page, the SDK skips that step and logs a console warning.
  • If no step in a tour can be found, the SDK skips the whole tour. It does not mark it as seen, because the visitor never saw it.
  • Finishing or dismissing a tour marks it as seen. It is not shown again automatically.

Replay and launcher ​

Enable the persistent launcher on the tour's Launcher tab to show a "Replay tour" button. It stays available after the visitor finishes. You can set its screen corner. A visitor can dismiss it for good in their browser.

You can also build your own button with startTour.

The tour's frequency cap limits only automatic playback. A manual replay always works.

Checklists ​

A checklist step shows tasks. A visitor completes a task by clicking it. You can instead bind a task to an event name. When your code calls track("that_event"), the task completes. Whichever happens first wins.

Single-page apps ​

Set trackRouteChanges: true so page-based targeting re-runs on each navigation. See init.

Preview on your site ​

The tour builder has a Preview on your site action. It uses the JustOneCX browser extension to play your draft on your own live page.

JustOneCX