You can create and manage your Launchers from the Chameleon Editor by clicking the Launchers icon.
Once you open the Launchers section, and hit 'New Launcher' then you will see option for pre-configured templates, for common use cases. You can hover over these templates to see a preview of the Launcher on the right-hand side before picking one.
Once you've selected your template, your Launcher is created, and you'll see the Launcher View in the Sidebar. You'll notice there are a few different sections:
- Configure -- set the styling and interaction behavior for the Launcher
- Who should see this? -- set which users should see this
- Items -- decide which tours should be within this Launcher. Read more here.
- Review and activate -- set your Launcher live
Once you click "Configure" you'll be moved into the Chameleon Launcher Editor (topbar) where you'll see all the configuration options.
The two tabs available at the top are for the 'Widget' and the 'Menu'
The Widget is the target which will open the Menu (the window that contains the list of tours). You can set the following configuration for this:
- Trigger: whether a user needs to click or hover over the target to open the Menu
- Widget Type / Target: you can choose a default icon, upload your own, set custom text or select an existing element on your page, to open the Menu
- Position: this is available if you use an icon for the Widget. If you choose an 'Element on page' then there is no positioning needed.
- Axis adjustment: you can manually adjust the position of the icon, by using px or % values
- Colors: if you selected an icon then you can change the colors for this
Note: you can also use our Launchers API to trigger the opening of the Menu without the need for a widget at all.
The Menu contains your list of tours, and other components, such as the Search bar. You can configure the following things:
- Content: you can click into the Menu title to directly edit the Header copy
- Widget and Height: you can set the width and maximum height for the Menu window. The window height will resize to fit the number of tours displayed until the maximum is reached.
- Colors: for the background and text
- Checklist: you can choose to show checkmarks adjacent to Tours once they have been completed
- Search: you can decide whether to show the Search bar in the Menu or not. This is great if you have a lot of Tours. The Search will return matches for any content (Tour title, Step body text etc.).
You can decide which pages to display the Launcher here. Read more about URL and element targeting here.
EMPTY STATE configuration
You can choose to either:
- Hide the Launcher when there are no Items in the Launcher (see below on how to remove Items from the Launcher once completed)
- Retain the Launcher but show an empty state inside the Menu. You can edit the copy of this empty state here.
Navigating and Preview
Once you have adjusted your styling and interaction behavior, you can click 'Preview' in the top-right side of the Topbar to view how the Launcher will behave for users.
Note: if you click into a Tour from the Launcher Menu then you will enter the Preview for that Tour. If you then click 'Edit' you will have the choice to edit that Tour or return to editing the Launcher.