Tour Launch Patterns

Tour My App supports a very flexible system of triggers. Triggers denotes when a tour should be run: should it run when the user visits a page? Or when they do some particular action? Depending on the purpose, there are many ways to trigger a tour. This page contains a list of common patterns used in triggering a tour.

You will need to know the tour id for the tour you want to launch. You can find this information next to the Tour name when you login to Tour My App

Display a tour when a user visits a page for the first time

Add this code to the <head> of the page

  <script>
      tour.start("<tour id>");
  </script>

What this code does is to tell the Tour My App integration to launch the tour specified by the Tour ID. Tour My App will keep track of the user and make sure that the next time they visit this page, they will not be shows the same tour again.

Display a tour //everytime// a user visits a page

Add this code to the <head> of the page

  <script>
      tour.start("<tour id>", true);
  </script>

Setting the second parameter as true tells Tour My App to show the tour, even if the user has seen the tour before

Display a tour when the user performs some interaction on the page

Sometimes, you only want the tour to display when the user does something on the page (example: clicks a help button).

To do this, call the tour run method inside the appropriate event handler.

For example, the following code will launch a tour when a button having id “help” is clicked:

  jQuery("#help").click(function() {
    tour.run("<tour id>");
  });

The difference between the start() and run() methods

You might have noticed that we use the run() method instead of the start() method used in the previous examples. What is the difference?

In short, the start() method will give priority to a tour which is midway in progress.

For example, let us say you have a “tour 1” which starts on “page 1” and continues on “page 2”. Also, there is another “tour 2” on page 2 set to start automatically when the user visits that page.

When you are doing the “tour 1”, and you visit page 2, then tour 1 will continue. Tour 1 will not stop and tour 2 will not start.

When you use the run() method, it stops any tours that are in progress and starts the tour passed to it.

Generally, when launching a tour automatically when the user visits a page, you want to use the start() method. When launching a tour based on a user interaction, you want to use the run() method.

Display a tour via a link

Tour My App allows you to create a link which will launch a tour after the page has loaded.

To create such a link, append ?tourmyapp=<tour id> to the end of the url.

To force the tour (even if the user has seen it before), append ?tourmyapp=<tour id>&tourmyapp_force=true

This technique has many uses, for example:

  • On the FAQ page, create links to the various pages with the Tour ID appended, so that they the user clicks the link, they are taken to the appropriate page and a tour starts automatically.
  • When a user contacts your support team, they can create a tour detailing the steps and give a link created as above to the user. When the user clicks the link, the tour will launch and take the user through the steps from inside the application.