Advanced site tour - plugin to drive the user's focus across the pagements to drive user adoption.
Advanced site tour makes it simple to create custom user on-boarding tours, trainings and announcements to drive user adoption.
Advanced site tour enables you to guide users through a custom tour or journey within your app or website. Highly customizable with minimal styles, Advanced site tour allows for powerful customization while being easy to use.

Based on driver.js library

Features:
- Highly customizable
- Highlight anything: highlight any element on page
- Feature introductions: create powerful feature introductions for your web applications
- Focus shifters: add focus shifters for users
- User friendly: Everything is controllable by keyboard
- Consistent behavior: usable across all browsers
- Working with repeating groups, including internal elements of repeating groups.

Advanced site tour can be used for a wide range of use cases:

- Onboard Users:
Onboard your users by explaining how to use your product and answer common questions.
- Remove Distractions:
With highlight feature, you can remove distractions and focus your users attention on what matters.
- Contextual Help:
Provide contextual help for your users, explain how to use your product and answer common questions.
- Feature Adoption:
Highlight new features, explain how to use them and make sure your users don't miss them.
- and much more.


So, yet another tour library?
No, it's more than a tour library. Tours are just one of the many use-cases. Advanced site tour can be used wherever you need some sort of overlay for the page; some common usecases could be: highlighting a page component when user is interacting with some component to keep them focused, providing contextual help e.g. popover with dimmed background when user is filling a form, using it as a focus shifter to bring user's attention to some component on page, using it to simulate those "Turn off the Lights" widgets that you might have seen on video players online, usage as a simple modal, and of-course product tours etc.

Supported Browsers:
IE / Edge, Firefox, Chrome, Safari

Instructions:
1. Add a "driverTour" element to your app page.
2. In your app settings, on the "General" tab, make sure "Expose the option to add an ID attribute to HTML elements" is enabled.
3. Set the "ID Attribute" for each element that you want the tour to reference. You can set the ID in the properties of each element.
4. In your page workflows, use the "addStep" action of the "driverTour" element to add all the steps you want in order. You'll probably want to do this in the "Page Loaded" event.
5. Use the "start" action of the "driverTour" element to start the tour.


Demo:
For detailed connection and demo information, visit the plugin demo page at
https://driverjs-21333.bubbleapps.io/version-test/driverjs

Plugin Page:
https://mindforapps.com/plugin_details/advanced-site-tour

Need help adjusting your new application?
Contact Jay at [email protected]

Support
And if you have any questions, reach out to us at [email protected]

We appreciate your reviews and suggestions.