Guides are created within the in-app guide designer. For an overview of the designer, see In-app designer (Classic).
Guide Types
Once your application is loaded in the guide designer, click "Add New Guide" in the bottom-left corner to create a guide. You will be presented with four guide types.
Tooltip
Tooltip guides anchor to a target element within your application. These are most commonly used for highlighting an element or feature.
Tip! Use a badge activated tooltip next time you want to call attention to a certain element or feature. It won’t interrupt the user experience.
Lightbox
A lightbox is a type of guide that is centered on the page. Lightboxes are commonly used for global announcements such as outages or major new feature releases.
Banner
Banner guides are a great way to provide information (new feature announcements) or solicit feedback (polls and surveys) from users without interrupting their workflow. Banners pop into view from the top or bottom of the window.
Walkthrough
A walkthrough is a grouping of the above guide types. They are often used for user onboarding. If you have a workflow that users are struggling with, you could build a walkthrough to help a user understand the process or accomplish the task.
What’s New
This guide type is reserved for notifications that appear within the "What’s New" section of the Guide Center.
Guide Status
Public
The guide is public to all visitors targeted in the guide’s segment and will appear in the designated "Location" on all environments with Pendo installed. Public guides will still appear on your designated staging servers.
Staged
The guide is only visible on your designated staging servers. Staging servers can be managed by admins of your subscription here. For more information on staging, see Stage your guide.
Draft and Disabled
The guide will not appear on any environment but can still be edited. While there is no functional difference between Draft and Disabled, these categories are useful for guide organization.
Delete
This will delete the guide and all of its data permanently.
Build a Walkthrough: Pt. 1
Click on Manage Guides In-App on the guides list page to navigate to the guide designer.
This example outlines building a walkthrough type guide. First, click "Add New Guide" in the bottom-left corner and select Walkthrough. Steps will later be added.
Name your guide
Click "Unnamed" to name the guide.
Segment
Who should see this guide? Use the default "Everyone" if you want the guide to display to all visitors, and "Only Me" if you are testing and only want to display the guide to yourself. You can also use a previously created segment from outside of the designer, or create a custom one on the fly.
Activation
Guides can be activated in a few different ways. A guide can use these activation methods simultaneously. For example, you can set a guide to both Automatic and Guide Center activation so that the guide automatically appears when a user visits the page, but is available in the Guide Center if they want to reference it again.
-
Automatically: The guide will automatically display to the targeted segment upon page load or previous step completion (if building a Walkthrough).
- Guide Center: The guide will not display until the user goes into the Guide Center and clicks on the guide. You can also provide search keywords if you have enabled search within the Guide Center to make guides easier to find. For information on enabling the Guide Center, see Guide Center (Classic).
- Badge: A small badge icon will display next to the anchor element in which the user can activate and view the guide. When you select badge as the activation method, additional styling and location options will appear below.
For more information on guide activation methods, see Guide activation.
Scheduling
If you want a guide to display for a specific period of time, you have the option of adding a "Guide Start Date" and "Guide Expires" date and time.
Advanced
Here is where you have the option to specify which devices you would like the guide to display on, as well as specify if the guide is meant for onboarding. If you select Guide meant for onboarding, a link to activate the walkthrough will be placed in the Guide Center (regardless of activation method).
Click "Save" in the top-left corner to confirm the overall walkthrough settings.
Build a Walkthrough: Pt. 2
Adding Steps
In this example, we will build a walkthrough composed of several different guide types. To start, click ‘Add a Step’ and select ‘Lightbox’ for your first step.
Content
You can select a template from the dropdown or customize the content/design of the lightbox as you see fit by modifying the HTML, CSS, and JavaScript.
Layout
These options allow you to adjust
Transition
How do you want the guide to progress to the next step?
-
Advance on Element Click: This option is only available for tooltip type guides. The guide will advance when the targeted element in your application is clicked.
-
Advance on Hover: This option is only available for tooltip type guides. The guide will advance when the targeted element in your application is hovered over.
- Advance on Button/Link/Script: The guide is advanced when the user clicks a button, link, or a code script within the guide.
Location
-
Only on this Page: This allows you to select a specific URL (or URLs) you want the guide to display on. The designer will automatically suggest Pages you have created in Pendo based on the URL that is loaded within the designer frame.
- Sitewide: The guide will display anywhere in your application (where Pendo is installed).
Element Matching
(required for tooltips only) If you want this guide to only appear when a specific element in your application is shown, you can use the Target HTML feature. When that element is visible to the end-user, the guide will display. This targeted element is what a tooltip guide anchors to.
Polls
Are you looking to add a poll? This tab provides you the option to add them here. For more information about polls, see Polls (Classic).