Skip to main content

Tour settings

Tour url

The most important setting for a tour is the url. You have to define a url for each tour, to tell on which website and page it should appear on.

Dynamic urls

Sometimes you might have an url that changes, for example, per user. Produktly supports dynamic urls, you just have to mark the parts of the url that are dynamic by enclosing them in these brackets {}. You can also define multiple dynamic parts of the url.

For example, if you have an url like https://example.com/users/321, and the 321 might change, you would enter https://example.com/users/{321} to the tour url.

Tour start

This configures when the tour should be started. There are four options:

  • Start tour immediately - The tour starts immediately when the page is loaded
  • Start tour minified - A beacon is shown on the bottom corner of the website with "Start tour" text. The user can click it to start the tour when they're ready
  • First time immediately, and then minified - The tour starts immediately for users who haven't seen it before. For returning users, the beacon is shown instead
  • Start tour manually - The tour won't show up unless you start it with code: window.Produktly.startTour({tourId: tourId}). See Start tour with code

Beacon options

When using minified or manual start:

  • Hide beacon (manual start only) - Hide the beacon entirely, so the tour can only be started via code
  • Beacon position - Choose between bottom-right and bottom-left

Tour trigger

This further configures when the tour should be triggered:

  • Once for user - The tour is shown only once for each user. After finishing or dismissing the tour, they won't see it again
  • Always - The tour shows up every time, regardless of completion

Multi-page

  • Multi-page enabled - When turned on, the tour can continue across page navigations. If the user navigates to a different page, the tour picks up where it left off.

Allow closing tour

  • Allow closing tour - Toggle whether users can close/dismiss the tour. When disabled, users must complete the tour.

Close on outside click

  • Close on outside click - When enabled, clicking outside the tour card will close the tour.

Save user progress

If set to "Yes", the tour progress is saved. So if a user starts the tour, advances to step 3, then leaves and comes back later, the tour resumes at step 3.

If set to "No", the tour always starts from the first step.

Element highlight timeout

When using the highlight step type, the tour tries to find the target element for the time specified in this timeout setting. If the element isn't found within the timeout, the step either skips or falls back to showing a static modal, depending on the "Skip if not found" setting (see Step Types).

Button text customization

You can customize the text on tour buttons:

  • "Start Product Tour" - Text on the beacon/start button
  • "Continue Tour" - Text shown when resuming a saved tour
  • "Next" - Next step button text
  • "Back" - Previous step button text
  • "Finish" - Final step button text

Targeting

Tours support the full targeting rules engine, allowing you to control which users and pages see the tour.

Styling

Select a pre-made theme or set custom theme and text colors. See Customization for details.