How to create a Tour (Single Page)
Sometimes, you need to guide new users through your product or existing users through new features, which is where Tours come in!
This guide will take you through the steps needed to create a Tour...
Creating your content and grabbing your Snapshot πΈ
Click 'Create New Content' and select Tour
Give your Tour a Name (*optional: add it to a section)
Grab your Snapshot by adding the URL of where you want the Tour to go
Choose the placement of your Tour Step to begin!
Placing your Tour Steps π―
While creating your Tour, you'll have placed your first Tour Step, as you have to put that before you can customize anything! You can update these at any point by heading to the Placement tab in the right-hand toolbox and clicking edit next to 'Tour Step HTML Selector':
Tour Step Settings π©
You have all the usual settings in the toolbox to customize the size, paddings, etc., plus some Tour-specific options:
Save user progress through Tour
Tooltip position > Auto or Manual
You can set a z-index (this controls which elements appear in front of others on a webpage)
Whether it's dismissible or not (setting per step as you might only want the last step to be dismissible)
From the Tour menu, you can easily...
Add new steps
Duplicate an existing step and tweak the copy
Re-order your steps
Move the menu to the top of the editor (if you're targeting a Tour Step at the bottom)
Customizing your Tour Steps π¨
Ready to make it look and feel your own? Open Components from the left palette, and drag on any text, images, buttons, etc., just as you would when building any content!
Ready to launch your Tour? You can follow the steps in this guide to publish your Tour and trigger it on page load, clicking a Candu CTA or programmatically from Javascript β‘οΈ