HTML attributes in Adopt data collection

Last updated:

This article summarizes the HTML attributes that Pendo collects for analytics by default and how to change this default data collection.

HTML attributes

HTML attributes provide additional information about HTML elements, such as the value of a form input or the URL of an image. Common HTML attributes include src, href,class, and id. The contents of these attributes can be used to identify and style specific elements on a website with the use of CSS selectors. Pendo relies on these selectors to identify feature clicks and to target guides. For this reason, your CSS selectors should be static, unique, and stable.

Events collected by default

For Click Events and Focus Events used for analytics, Pendo collects specific attributes and properties by default:

  • The type of element that was clicked, such as <div><p>, <a><span>, or <button>.
  • The text inside of elements, such as <a><span>, or <div>.
  • The id or class of the element.
  • Other attributes of the element if they exist, including titlehref, 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 don't collect user-entered text inside of <input> or <textarea> fields. By default, we also exclude the document <title> in load events, but you can enable this at the application level with the Collect Page Titles setting. Navigate to Settings, open the Applications tab, select the appropriate application from the list, and then select Collect Page Titles.

We collect the same data for all parents of the clicked element up through the HTML hierarchy (or Document Object Model, DOM) to the <body> tag.

You can adjust the data that Pendo collects on Click Events and Focus Events by adding custom HTML attributes.

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

Custom HTML attributes

You can add custom HTML attributes for Pendo to record in raw events, in addition to the default attributes that are already collected. This can include the custom attributes that you use for analytics or automation testing, such as specific information about visitors, accounts, or events that aren't captured by default.

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

In the following example, the only attribute that we can use by default for Feature tagging is the class="block-list". That class might not be unique to the element across the entire page or app, and might not be specific enough to isolate that unique feature. 

<a class="block-list"

The example above 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.

You can add custom HTML attributes in Pendo to track this information.

Add custom HTML attributes

  1. Open Settings from the bottom-left corner of Adopt.
  2. Open the Applications tab.
  3. Select your application from the list.
  4. Under Custom HTML attributes, enter an attribute that you'd like to add and select + Add Attribute

Using the example in Custom HTML attributes, you can start collecting the data-id attribute by tracking everything beginning with data- and including the wildcard (*) rule: data-*. This means that every attribute that starts with data- will be recorded. Alternatively, 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. Any features tagged with a custom attribute in the rule don't have retroactive analysis prior to when the custom attribute was added. Pendo doesn't capture custom attributes in your raw event data until you've identified them.