1. Pendo Help Center
  2. Data in Pendo
  3. Events

HTML attributes in 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, CSS selectors, identify and style specific elements of a website. 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>, 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 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 don't 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 (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 and by limiting Pendo data collection for specific elements.

Note: For web applications using the install script, all text on the page, including the innerText of elements, is eligible to be collected by default based on Feature click activity and additional Feature tagging settings. You can turn off this automatic text capture at the subscription level by contacting Pendo Support or at the page level by updating your install script, but doing so can complicate Feature tagging. For extension apps, innerText isn't captured by default. To turn on text capture for individual extension apps, contact Pendo Support.

Exclude specific element tracking

You might want to limit the attributes Pendo collects to protect personally identifiable information (PII) or other sensitive information. To exclude data from a specific element being passed to Pendo, you can either:

  • Ask Pendo Support to add HTML attributes to your application's htmlAttributeBlacklist. This stops Pendo from collecting the attributes that you specify on all future click events and focus events.
  • Add a .pendo-ignore class to any element in your code to prevent Pendo from capturing the element. This works for Pendo agent version 2.9 and above.

In the example that follows, the code only ignores the first button element. A click on either the span containing the text "Submit Payment" or the "Submit Payment" button element itself is ignored by Pendo because a click event captures the element that was selected, as well as its parent elements. This means that a click on either the span or the specific button captures the .pendo-ignore class in the event, causing that event to be ignored. 

<div class="payment">
    <button class="pendo-ignore payment-button">
       <span>Submit Payment</span>
    </button>
    
    <button class="cancel-button">
       <span>Cancel</span>
    </button>
</div>

In the next example, the code ignores the entire div. Because we added the .pendo-ignore class to a parent element of both of the buttons, a click anywhere inside that div is ignored by Pendo. 

<div class="pendo-ignore payment">
   <button class="payment-button">
     <span>Submit Payment</span>
   </button>

   <button class="cancel-button">
     <span>Cancel</span>
   </button>
</div>
Was this article helpful?
10 out of 18 found this helpful

Articles in this section