Guide activation

There are two types of guide to choose from:

• A walkthrough Guide, which can consist of a combination of Tooltips and Lightboxes.
• A Badge, which provides in-line support when the end-user selects or hovers over an icon that you place on the page.

Walkthrough guide activation methods

A walkthrough guide can be presented to users automatically, through the Resource Center, or a combination of both. If no activation options are selected, the default is automatic activation. You can disable automatic activation to ensure your guide doesn’t appear at all.

To turn automatic activation on or off:

1. Navigate to Guides in the left-side navigation.
2. Find and open your guide from the list. 
3. Select Edit in the top-right of the Activation card.
4. Toggle Automatic Activation on or off as required.
5. Select Save.

 

To add an existing guide to the Resource Center:

1. Navigate to the Resource Center in the left-side navigation.
2. Find and open your Resource Center from the list.
3. Add a Guide List Module if one doesn’t yet exist.
4. Hover over your Guide List Module and select View Module Details.
5. Select Edit in the top-right corner of the Content card.
6. Select your Guide from the dropdown menu.
7. Select Save.

Badge options for inline support

In-line support is activated when the user interacts with a badge that you place on the page. A badge is a type of guide that provides supplemental information about features that would otherwise clutter the UI if permanently displayed. Follow the instructions under Create a guide in the Guide Designer: Adopt Studio article to learn how to add a badge guide type to your page.

You have a number of options in Badge Settings, which you access by selecting the gear icon underneath the badge container while creating or editing the badge. In these settings, you can:

• Choose a Badge Icon.
• Choose a badge Position.
• Enter a badge's pixel Offset.
• Choose an icon Color based on a hexadecimal number.
• Set the Z-Index for the badge placement.
• Show or hide the background when the in-line support is open with the Show Backdrop option.
• Conditionally display your badge using the option to Enable Element Contains Rule.
• Choose whether the badge is displayed sitewide or on the specific page under Page Location.

 

You can also customize the following options:

• Guide Behavior. Choose whether you want the guide to appear only when the badge icon is clicked, or also when the user hovers over the badge icon.
• Badge Behavior. Choose whether you want to badge to always be present on the page, or only when the user hovers over the element it's attached to.

 

As well as choosing from one of our standard icons, you have the option to upload a custom image for your badge. When creating or editing a badge:

1. Select the gear icon underneath the guide container to open Badge Settings.
2. Open the Badge Icon dropdown menu and choose Custom Image.
3. Upload your image into the grey box that appears at the top of the Badge Settings window.
4. Select Done in the bottom-right corner of Badge Settings.

 

The icon you upload must be the size of your intended badge. Our standard icon size is 14 x 14 pixels.

Element Contains Rule for tooltips and badges

Use the Element Contains Rule to conditionally display tooltips and badges based on the contents of the target element. This can be text or numbers.

For information on tooltips and badges, see Guide Designer: Adopt Studio, which walks you through creating a guide.

Once you’ve created your first Tooltip or placed your Badge in the UI:

1. Select the gear icon to open Settings.

2. Toggle on the Enable Element Contains Rule option.

3. Choose your content type from the first dropdown menu: Text or Number

4. Choose from the value options in the second dropdown menu. 

5. Enter your value.

6. Select Done.

 

If you chose Text as your content type, you have Contains, Does Not Contain, Exactly Matches, and Does Not Match available to you. If you chose Number as your content type, you have Equals, Not Equal To, Is Greater Than, and Is Less Than available to you.

Only one Element Contains Rule can be configured per guide.

 

 

Guide anchoring and persistence for lightboxes

Use Guide Persistence to activate your guide when an element appears and to ensure that your guide persists even if the element then disappears.

If you use a lightbox as the first step in a guide, you can anchor that guide to a particular element that appears on the screen, including time-limited alerts and modals. Once you’ve created your lightbox as the first step in your guide:

1. Select the gear icon underneath the guide container to open Step Settings.

2. Toggle on the Guide Persistence option.

3. Choose the Make selection button, or the Re-select button if you're changing an existing selection.

4. Choose the UI element you want to anchor the guide to.

5. Select Done.

 

 

For more information on Step Settings, see Editor Mode in the Guide Designer: Adopt Studio article.