The UserGuiding JavaScript SDK officially provides the following client-side methods as part of it's API.

previewGuide (guideId, options)

Triggers a guide. If there is already an active guide preview, this force stops the preview, then starts the requested guide.

Available options:

  • initialStep: number  

step number that guide will start from [default = 0]

  • checkHistory: boolean 

should we apply/bypass preview filters (targeting, segmentation, display count) [default = false]

Example previewGuide  calls:

// Just trigger a guide with default options
userGuiding.previewGuide(1226)

// Start guide from 2nd step and apply preview filters
userGuiding.previewGuide(1226, {
  initialStep: 2,
  checkHistory: true
})

finishPreview()

Force stops the active guide preview.

Example finishPreview  call:

userGuiding.finishPreview()

launchAssistant( checklistId ) 

Displays checklist/assistant. If there is already another checklist shown this call will close it, then show the requested checklist.

To locate the checklist/assistant ID; visit your panel and go to the checklist's settings page, the ID is located within your url in the last part.

Example launchAssistant  call:

userGuiding.launchAssistant( 1246 )


triggerNps(options)

Triggers NPS survey form. This call bypass page view per session & view count filters, while applying time and sampling filters.

Available options:

force: boolean

No nps filters will be applied with 'force' option; it will be directly opened.

Example triggerNps  call:

// Apply filters and decide whether to show the nps
userGuiding.triggerNps()

// Bypass filters, open the nps directly
userGuiding.triggerNps({ force: true })

Callbacks

onNpsOpen

Execute a callback when nps is open

window.userGuidingLayer.push({
   event: 'onNpsOpen',
   fn: __YOUR_FUNCTION_HERE__
})

onScoreSubmit

Execute a callback when score is submitted

window.userGuidingLayer.push({
   event: 'onScoreSubmit',
   fn: __YOUR_FUNCTION_HERE__
})

onUniqueScoreSubmit

Execute a callback when score is first submitted (User may click back and change the score)

window.userGuidingLayer.push({
   event: 'onUniqueScoreSubmit',
   fn: __YOUR_FUNCTION_HERE__
})

onFeedbackSubmit

Execute a callback when score is submitted

window.userGuidingLayer.push({
   event: 'onFeedbackSubmit',
   fn: __YOUR_FUNCTION_HERE__
})

onload

Execute commands when script loaded and userGuiding API is ready.

example call:

window.userGuidingLayer.push({
  event: 'onload',
  fn: () => console.log('UserGuiding script loaded'),
})

onPreviewStart

Execute callback when a guide preview start.

example call:

window.userGuidingLayer.push({
  event: 'onPreviewStart',
  fn: (data) => console.log(data)
})

example output:

{
  guideId: 1226
}

onPreviewStep

Execute callback when a guide's step previewed.

example call:

window.userGuidingLayer.push({
  event: 'onPreviewStep',
  fn: (data) => console.log(data)
})

example output:

{   
  guideId: 1226,
  stepIndex: 1
}

onPreviewEnd

Execute callback when a guide preview end.

example call

window.userGuidingLayer.push({
  event: 'onPreviewEnd',
  fn: (data) => console.log(data)
})

example output 

{   
  completed: true, // false if user bounced
  guideId: 123456
}
Did this answer your question?