You can install and start using Usetiful tours in just 3 steps

A. Add the script to your pages

B. Create and preview a tour (opens in new tab)

C. Publish your tour (opens in new tab)

Please note:

Here's a quick video on how to install Usetiful 

A. Adding the script to your pages

Usetiful works by adding a javascript code to your application that allows to show tour content you build to users. You can find your script on the Overview page after login.

  • Click on the "Install to your site" button, and the code will show up.
  • Copy it and paste to the end of all pages where the Usetiful should show the content; immediately before the </body> element.

Copy the code in the window and add the code to any page on which you plan to have tours, smart tips or checklists.

Usetiful tours will not work on a page where the script is not present.

Once you installed Usetiful, you can start to publish product tours and begin collecting data for their analysis. The only thing you need to do is to embed a bit of javascript to your website. Tools like Google Tag Manager can make it even easier.

Using Google Tag Manager to install Usetiful

Google Tag Manager (GTM) is a free tool that allows you manage and deploy tags (snippets of code or tracking pixels) on your website (or mobile app) without having to modify the code. Using GTM requires to be registered and have their javascript code added on your website. Then you can manage your code online.

1. To add the Usetiful code to GTM, login to your GTM account and select the appropriate container for your website.

2. Open your Tags section from the menu and add a new tag.

3. Edit tag configuration and choose tag type Custom > Custom HTML.

4. Paste your code to the HTML text area. It should look similar to the picture below:

5. Now, we need to ensure that the script is called once all the elements on your site are loaded. Therefore click on the Triggering section and add a new trigger of type DOM ready. If you want to trigger the script just on specific sites or pages, select the option This trigger fires on > Some DOM Ready Events and specify the configuration.

6. Save the new trigger.

7. Select the new trigger, so it shows up below the box with Usetiful code.

8. Save the created tag.

9. Publish this change clicking on the Submit button. After a few seconds should be code embedded to your website.

Please note: Google Tag Manager is being filtered out by some Ad Block plugins. This is, unfortunately, outside of control of Usetiful.