1. Pendo Help Center
  2. Community
  3. Guides

Guide to navigate page

Avatar
Jarrod Neven

How do you make a guide that can navigate to different parts of the web page between steps.

We have a single page web application and want the guide to explain key parts of the application. But the user needs to click on different objects within the DOM to make each part visiable. So the guides are usless to us unless there is some interaction with the page.

To acheive this we could run a single line Javascript code to interact with the app as it moves from one step in the guide to the next, or a CSS selector with a click action like Selenium. But Pendo does not seem to have this functionality. Seems like a core feature so I am guessing I am missing something basic here.

 

0

Comments

1 comment
Date Votes
  • Avatar
    Liz Feller
    Expert (Gold)
    Idea generator
    Great answers

    You have two basic options here:

    1. Have each guide step be sitewide and include a "next" button to advance each guide step to the next one. Guide steps should have instructions so the user knows what they should be doing before clicking "next" to see the content you have for them.
    2. Have each guide step be targeted to some element on the page, and instead of a "next" button, update the guide step action to advance on element click. This way, there are less clicks and the user "follows along" with the content as they navigate your app.

    We end up using a combination of auto-advancing steps (#2) and having "next" buttons because sometimes in a tour users don't WANT to go to the thing you're pointing them to at that very moment, or they may not have access fully, or it may lead them somewhere off on a tangent when we want to focus their attention on an overall orientation. Also be careful of how many steps you use -- people will dump out after usually 5 or 6.

    0

Please sign in to leave a comment.

Didn't find what you were looking for?

New post