Click Create Guide in the top-right corner to begin guide creation.
You’ll be asked to choose a layout. Select one from the given options.
Next, you’ll be presented with the Guide Settings page. Here you’ll be able to manage your Content, Activation, Segment, and Scheduling. You can rename your guide and begin editing the settings.
To edit your Content, you may hover over the guide image and click the Manage in App dialog box that displays (1), or click the Edit button in the top right corner of the Content widget (2).
Next, you’ll be asked to provide the URL of where you’d like to see your guide. When you click Launch Designer, a new tab opens, where Cartegraph Engage will load the Visual Design Studio on your application.
Specific to your product, you will be prompted to sign in to the new tab. Once you are signed in, the Visual Design Studio will load over the product URL you specified.
Once the designer loads, be sure to open the step tray (1) so you can see all your customization options and guide steps. If you wish to target an element but the action bar (2) is covering it, move it to the bottom of the screen by clicking on the dual arrows button in the top right-hand corner of your screen. To navigate to another page, either because you want to start or target your guide somewhere else or because your next guide step is on a different page, click the Navigate icon (3).
You can make any initial edits to your guide within the Edit Container dialog box. Once you click Apply, you will be able to hover over the placeholder items within the guide preview and click to edit. If you need to add a new building block to your guide, hover between items to see the blue line and add your desired building block.
Periodically save your changes as you edit your guide. This will help you save your progress as you go.
Want to add a step in your guide? Click on the + Add Step option in the step tray so you can add a new step without having to start over.
Once you’re satisfied with your guide (one or all guide steps), hover over a guide container (the edge of the guide) in a step to edit its settings:
The Styling, Location, and Behavior options will display after you click the edge of the guide container for additional customization:
Lastly, make sure you are using the Guide Activation method you want in the action bar:
Clicking on the Activation tile in the tray or the button in the Action Bar will allow you to edit your Activation method. You will have three options:
- Automatic (1): Guide appears once automatically until dismissed or advanced.
- Badge (2): Guide appears after a visitor clicks or hovers over a badge icon.
- Target Element (3): Guide appears after a visitor clicks on a targeted element.
You can choose just one or apply Automatic + Badge or Automatic + Target Element. You cannot choose Badge + Target Element. For more information, see the Guide Activation Options topic.
Once you are finished, save your changes by clicking the top left-hand Save button and click Exit to leave the designer.
Users can test all of their guides (no matter the activation), and before publishing to the intended audience they can clear the data to not have test views skew the metrics.
To test your guide, segment the guide to yourself.
Locate the Segment tile in the Guide Details Page and click the Edit icon. Then, choose the field to select Custom Segment. Here, you will add a segment rule so that Visitor ID equals yourself.
For example, if my Visitor ID is my email address, my rule would look like this:
To find your visitor ID, open your browser's console window and type
Once you’re done, click Save Segment and then click Save within the Segment tile. Review your guide details and update your guide status to Public. Since the guide is segmented to just yourself, the guide will only be visible to you.
Clear Guide Data
Automatic guides only display for visitors and have no dismissal event for the guide. A dismissal event occurs, typically, when a user clicks the top right X in any of the steps. When testing your guides, you may want to see these guides multiple times. To do this, you will need to clear the guide data. This will reset all of the collected guide data. You can use this option to have the guide appear again to users who have previously seen and dismissed it.
On any guide details page, click the three dots next to the guide status and select Clear Guide History. You will be prompted to input clear-guide-data as an extra precaution.
If you’re satisfied with your guide, navigate back to your guide’s Detail Page to readjust the segment to the correct audience.
To publish your guide, you have two options to choose from:
- Publish your guide now by updating the guide status to Public.
- Schedule when your guide will go live (and, if needed, when it will no longer be active).