Splitting Paths for a Guide
Hey Pendo Team!
I am curious if there is a way to split the paths of a guide, or segment, based on if an on screen element is present. For example, could we create a walkthrough that would have path A: Visitors with the element present and path B:visitors without the element present? We attempted to do something similar with segmenting based off of feature tagging, but it appeared that the visitor would need to have clicked on the element in order to segment this way.
Thanks for your help!
0
Comments
You can kind of do this by using some javascript to skip steps if there is a screen element visible or missing.
https://github.com/pendo-io/snippets/tree/master/guides/goToGuideStep/goToStepNoElement
This would keep all the steps in the same guide, so the analytics might be a little funky, but perhaps you could adapt the javascript so that instead of skipping steps, you are launching a new guide for if the element is not present? That second guide would just pick up where the previous left off, and would need to be segmented exactly the same as the previous guide, and its activation would be turned off for all but API call.
Thanks Liz Feller for the suggestion!
We also have another suggestion from our friend Michael Fontinatos @ Pendo PS to try this:
https://github.com/pendo-io/snippets/blob/master/guides/advancingGuides/advanceGuideOnElementAppear/advanceGuideOnElementAppear.js
You'll need to check for an element in the DOM and then advance or launch a new guide accordingly.
Let us know what works for you Callie Friedman!
Non-developer here... when you all say "add/adapt javascript", how are you doing that/ what exactly are you instructing your devs to do? We installed our pendo snippet via Google Tag Manager and it's the same site wide.
Brittany Perna - did you ever figure this out? I am struggling with a similar issue and I am not sure what this post means by "add/adapt javascript"
David Betancourt, nope, never got clarity :(
Howard Lio - I too would be interested in a more comprehensive breakdown of how to use this and the other code snippets in the GIT library you linked above. When looking through the documentation around the custom code block in guides, there's documentation about how to add the content, but not actually make use of the module (referring to this documentation: https://support.pendo.io/hc/en-us/articles/360032206011-Using-Custom-Code-Block). Any chance that there's additional documentation out there that shows the implementation side?
man it's been awhile on this one! In order to implement anything from the github, you're usually going to add a custom code building block to each step where you need to add javascript (or HTML or CSS, depending on what you're doing). From there it should be copy/paste from your resource in the appropriate tab for HTML/CSS/Javascript.
In terms of implementation examples, we have used this to either further style/place a guide step on the screen using CSS. We've also used javascript to detect what URL a visitor is on when viewing the guide step, then when they click Next taking them to a specific "next" step based on how much extra navigation steps they might need to keep going in the walkthrough. For example, if they're already on the page to do a task, skip all steps; if they're one page away from where the task takes place, only show them the one nav step they need.
Please sign in to leave a comment.