Javascript API

Once the HelpHero script loads it makes a global object HelpHero object available to your web page. This allows your to interact with HelpHero from your own scripts, meaning you can start & stop tours, listen to events and more. The following methods are available on the global HelpHero object.

HelpHero.identify(userId, [properties])

Identify the current user with a userId (string or number) and an optional set of user properties (object).

HelpHero.identify("<USER_ID>", {
  name: "<NAME>",
  role: "<USER_ROLE>"
});

HelpHero.anonymous()

Generates a unique user id which will be persisted in the user's browser until the browser cache is cleared.

HelpHero.update([properties])

Calling the update method with an object of user properties will update those fields on the current user and then check if any tours should be auto started based on the new properties.

HelpHero.update({
  hasPlan: true
});

Or pass function to update based on current properties

HelpHero.update(function(currentProperties) {
  return {
    hasPlan: !currentProperties.hasPlan
  };
});

HelpHero.startTour(tourId, [options])

Starts tour with the specified tour id. The tour will only start if the user is on an URL that matches the starting URL Match specified in the tour. How do you find your tourId?

Start tour ignoring if user has already seen tour:

HelpHero.startTour("<TOUR_ID>")

Start tour only if user has NOT already seen tour:

HelpHero.startTour("<TOUR_ID>", { skipIfAlreadySeen: true })

HelpHero.advanceTour()

The current active tour is moved forward one step. Does not currently work on Highlight steps which require user to click within highlighted area

HelpHero.cancelTour()

The current active tour is immediately cancelled.

HelpHero.openLauncher()

Opens the HelpHero Launcher if there are tours available for the current page that have "On Demand" enabled.

HelpHero.closeLauncher()

Closes the HelpHero Launcher.

HelpHero.on(eventName, listenerFn, [context])

Register a callback function that will be invoked when tour events occur.

  • tour_started
    A tour is started either automatically on user's first visit, by the user using the launcher or via the API.
  • tour_completed
    A tour is completed from start to finish.
  • tour_advanced
    A tour is advanced to the next step either by the user or via the API.
  • tour_cancelled
    A tour is cancelled either by the user or via the API.
  • tour_interrupted
    A tour was interrupted due to user navigating away from the page or because the appropriate element to highlight was not found within the timeout (20s).

Example:
HelpHero.on("tour_started", function(args) {
  console.log(args);  
})

HelpHero.off(eventName, listenerFn, [context])

Unregister a callback previously registered using HelpHero.on