The following functions allow you to manipulate Usetiful tours using JavaScript. They are available on all pages where the Usetiful script is installed.


window.USETIFUL.tour.start(tourId)

  • This function allows you to start any published tour according to the given tour id. Tour's id can be found in the editor URL (e.g. https://www.usetiful.com/product-tours/creator/23)If the function was called correctly, the tour will display immediately on the current page regardless tour's targeting.

window.USETIFUL.tour.nextStep()

  • This function moves the currently running tour to the next step.

window.USETIFUL.tour.preStep()

  • This function moves the currently running tour to the previous step.

window.USETIFUL.tour.close()

  • This function closes the currently running tour.

window.USETIFUL.tour.jumpTo(stepNumber)

  • This function moves the currently running tour to the step based on the given step number (e.g. the first step has number 1).


window.USETIFUL.tour.getState()

  • Returns an array of all tours available on the current page and tours for which the current user has saved status. The list contains details to identify the tours and their status. Sample output below:

  • [
    {name: 'Tour 1', id: 12, isAvailable: true, state: 'never run'}, 
    {name: 'Tour 2', id: 14, isAvailable: true, state: 'closed'}, 
    {name: 'Tour 3', id: 4, state: 'inProgress', currentStep: 0, isAvailable: false}
    ]


window.USETIFUL.reinitialize()

  • This function re-initializes the script on the page on demand.