Identify
Let's start with Identification
Right now, the government is not tracking you.
By "logging in" here, you will:
- Trigger a pendo.initialize() event with the entered info.
- Set your visitor and account IDs in local storage for later reference.
- You are currently identified as visitor:
Features
Feature Tagging & Click Events
things to add here and in features below the big boxes: buttons, modal, disappearing and/or hidden elemnts, nth children, card containers where the :contains text is a sibling, custom html elements, dynamic ids
I'm Dynamic!
How can you tag me when my ID changes with every page load?
Modal
How to tag things in a modal? I am so sorry for how bad this modal is.
Multiple pages in a single-page world
How could you tag the different sections of this app as if they were pages?
Can you tag this button and ONLY this button?
HTML Attributes
Check out our Things and Stuff
This would probably be a good place for the modals and siblings
- All
- Things
- Stuff
No IDs
How can you tag identical elements?
Come up with a way to tag these creepy siblings.
We're all the same
except our text.
How on earth
can you tag us?
Click Event Properties
Capturing All the Things!
In the form below, the only thing that generates a click event is the button.
How can I capture the responder's first and last name?
Bonus if you include a boolean indicating if Pendo guides are disabled on the page.
Name:
1630 Revello Drive, Sunnydale CA
Email:
buffy@slayer.biz
Quest:
+1 123 581 3213 ext 4
Disappearing Elements
WHERE'D YOU GO?!
In the form below, some fields conditionally appear and others aren't what they
appear.
Can you tag each individual "button"?
Can you make a multi-step guide that explains each
field?
trackEvents
What if there are no clicks?!
Sometimes you want to track things that aren't linked directly to a click.
How to capture the search when you hit enter?!?
Which floof gets dropped in the box?
How long does it take an upload to complete?
F.U.C.C.
Frequent(ish) Used Console Commands
We all know validateInstall, but do you know these?
Open up the Console in dev tools and try these out!
-
How can you get a list of guide NAMES available on this page?
pendo._.pluck(pendo.guides,"name")
-
How do you know which element is getting a click?
window.addEventListener('click', (e) => console.log(e));
-
How can you identify a new visitor via the console?
pendo.identify({"visitor": {"id": "visitorId"},"account": {"id": "accountId"}})
-
Ac odio tempor orci dapibus. Aliquam eleifend mi in nulla?
Dolor sit amet consectetur adipiscing elit pellentesque habitant morbi. Id interdum velit laoreet id donec ultrices. Fringilla phasellus faucibus scelerisque eleifend donec pretium. Est pellentesque elit ullamcorper dignissim. Mauris ultrices eros in cursus turpis massa tincidunt dui.
-
Tempus quam pellentesque nec nam aliquam sem et tortor consequat?
Molestie a iaculis at erat pellentesque adipiscing commodo. Dignissim suspendisse in est ante in. Nunc vel risus commodo viverra maecenas accumsan. Sit amet nisl suscipit adipiscing bibendum est. Purus gravida quis blandit turpis cursus in
-
Tortor vitae purus faucibus ornare. Varius vel pharetra vel turpis nunc eget lorem dolor?
Laoreet sit amet cursus sit amet dictum sit amet justo. Mauris vitae ultricies leo integer malesuada nunc vel. Tincidunt eget nullam non nisi est sit amet. Turpis nunc eget lorem dolor sed. Ut venenatis tellus in metus vulputate eu scelerisque. Pellentesque diam volutpat commodo sed egestas egestas fringilla phasellus faucibus. Nibh tellus molestie nunc non blandit massa enim nec.