HTML Attributes

Collected Events

For click and focus events used for analytics, Pendo only collects specific attributes and properties by default:

The type of element that was clicked (<div>, <p>, <button> etc.)
The text inside of elements such as <a>, <span>, <div>
The id and/or class(es) of the element
Other attributes of the element if they exist, including title, href, and tabindex.
For <button>, we collect value (the text of the button) and name
For <img>, we collect src and alt
For <select>, we collect type and selectedIndex
For <textarea> and <input>, we collect name

For privacy reasons, we do not collect user-entered text inside of <input> or <textarea> fields, or the document <title> in load events.

We collect the same data for all parents of the clicked element up through the HTML hierarchy to the <body> tag.

Note: You can configure the Pendo agent to not collect any of the text on the page, including innerText of elements, but this may make it more difficult to tag Features.

Custom HTML Attributes

What are Custom Attributes?

Custom attributes allow you to choose additional attributes for Pendo to record in raw events, in addition to the default attributes that are already collected. For example, this can include the custom attributes that you use for analytics or automations testing.

Custom attributes affect Analytics only. Element targeting in Guides reads the entire DOM and doesn't rely on custom attributes being identified to use them for guide targeting.

Any features tagged with a custom attribute in the rule doesn't have retroactive analysis prior to when the custom attribute was added in Settings. Pendo doesn't capture custom attributes in your raw event data until you have identified them.

Requirements

Pendo Agent version 2.3.0 or greater
Pendo Admin user

How Does It Work?

Here is an example of HTML in an app:

<a class="block-list"
   target="_blank"
   data-id="1.0-Nav-Home.Dashboard">

In this example, the only attribute that we could use by default for Feature tagging is the class="block-list". That class might not be unique to that element across the entire page or app, and might not be specific enough to isolate that unique feature. However, this example site includes an additional attribute called data-id that contains some helpful identifying content. Specifically that this <a> tag has the value 1.0-Nav-Home.Dashboard for data-id.

Admins can access Custom HTML Attributes on the Install Settings page under the Agent Settings tab.

To begin gathering the data-id attribute, you could choose to track everything beginning with data- with the rule data-* (meaning every attribute that starts with data- will be recorded) or you could target the specific attribute of data-id. Pendo starts collecting the attribute in raw events 15 to 30 minutes after saving the new custom attribute in Settings.

Frequently Asked Questions

How do I start collecting custom HTML attributes if I self-host the agent?

The Pendo Agent controls which elements are stored in raw events. Changes to Subscription and App Settings, including Install Settings, generally impact the way the Agent functions. If the Agent is self-hosted, you need to download and install the Agent after making any settings changes for the latest changes to take effect. If the Agent is not self-hosted, the Agent that is downloaded when the user initializes Pendo includes the current subscription settings automatically.

Why is Pendo not suggesting my custom HTML attributes?

It could be that the custom attribute you're trying to tag is being filtered out by Pendo's dynamic filtering algorithm. Dynamic filtering is on by default every time you open designer. Turn off the dynamic filtering setting in the Visual Design Studio using the toggle under the collapsible Settings section at the bottom of designer. You must actively turn off dynamic filtering each time you launch the designer. This helps avoid tagging dynamic selectors. For more information on dynamic selectors, see Tagging and viewing Features.