Page event properties

Page event properties help you gather additional information about Pages for tagging purposes, such as the page title, class name, and innerText.

When you add a Page event property, this information is appended to your Page URL in Pendo as an extra query parameter. This modification occurs only on the backend data sent to Pendo and doesn't impact what your visitors see when navigating your app. This functionality is particularly useful for static or indistinct URLs, such as those shared by multiple Pages.

Note: Page event properties are strictly used for tagging purposes and aren't currently available for use in segments or reporting like other event properties. In addition, only Pendo Admins can enable and manage Page event properties.

Step 1. Enable Page event properties

If you're a Pendo Admin, use the following steps to enable Page event properties:

1. Navigate to Settings > Subscription Settings, select the Applications tab, then open an app from the list.
2. Locate the Page event properties setting within the Basic settings section. There are two settings relevant to Page event properties. Enable each one as needed.
   • Page event properties. When you select Enable, this adds the ability for Pendo users with tagging permissions to manage Page event properties within the Visual Design Studio. It's important to note that this setting could allow you to collect personal data and send it to Pendo, so be mindful of your company's policies regarding personal data collection and processing. For information about personal data in Pendo, see Data collection and compliance. For questions, contact Pendo Support.
   • Collect page titles. When you enable Page event properties, you can access this nested setting, which allows you to gather webpage titles automatically. If your HTML file has a <title> value in its header, this setting ensures that value is included in the URL data collected by the Pendo agent. The collected titles become distinct Page tags by adding a query parameter named pendo_document_title to the URL.
     
     For example, if the title of www.example.com/home is "Welcome Page", the URL is captured as https://www.example.com/home?_pendo_document_title=Welcome+Page.
     
     These Page tags then populate as Untagged URLs and Suggested Pages and are available to use with the Suggested Page Title Match and Rule Builder when tagging a Page in the Visual Design Studio.
     
     
     
     
3. Turn on these settings for each app as needed.

Step 2. Manage Page event properties

If you're a Pendo Admin, you can create and manage Page event properties from the Pages page in Pendo.

1. Navigate to Product > Pages, then open the Tag Pages dropdown and choose Manage Page event properties.
   
   
   
   
2. Enter your app URL, then select Launch Designer to open the Page Based Event Properties modal in the Visual Design Studio.
3. Select Add Event Property, then enter a Name to identify the Page event property in Pendo using only lowercase letters, numbers, and underscores (no spaces).
4. Next, select the Source used to determine the context of the event property. You can use Standard (CSS) targeting to refine the list of properties for the value, or you can select Advanced (JS) to use Javascript and target a property directly.
   
   If using the Advanced (JS) option, you must specify the path to a value referencing window object properties. You can't invoke functions; the value must already be populated. Unless you're comfortable with using your browser's developer console, we recommend using Standard (CSS) to target an element. This option allows you to easily select the correct properties, like input fields.
5. Select Target to find an attribute that represents the dynamic element you're trying to target, or enter the CSS Selector if you know what it's called. This can be any attribute or text available in the HTML for this page, excluding content within nested iframes. If you need help, we recommend using your browser's inspect tool and referencing Advanced Feature tagging as needed.
6. Select the field labeled Select a value for the element, then enter the value of the event property or select an option in the dropdown menu.
   • The most commonly used value options, like innerText and textContent, display at the top of the dropdown menu. Choose the option that gives you the Preview that matches what you want to collect.
   • This field also supports modifiers to the selected property. For example, innerText returns the text contained in the element, and adding innerText.length returns the number of characters in the text.
7. Optionally, open the Settings section to turn Filter Dynamic Elements on Selection on or off. If your selector involves elements with dynamic identifiers (for example, an ID that changes with each page load), this setting controls whether Pendo attempts to filter those dynamic elements out of the generation process for the event property. We recommend keeping this setting turned on to enhance the accuracy of your event property value.
8. To create the Page event property, select Save. This returns you to the list of available event properties in the Page Based Event Properties modal and adds the event property to the rule builder so that you can select these values while tagging in the Visual Design Studio. When a new Page event property is added, it can take up to 10 minutes before it's available for use in tagging.
   
   
   
   
9. Repeat steps 2 to 8 for each event property you'd like to create.

Step 3. Tag with Page event properties

After you create your Page event properties, you can use them to tag Pages. Note that it can take up to 10 minutes after adding an event property before it's available for use in tagging.

For detailed tagging guidelines, see Page tagging.

1. Select Exit in the toolbar or close your tab to exit the Page Based Event Properties window in the Visual Design Studio and return to Product > Pages in Pendo.
2. Select Tag Pages, and enter your app information to open the Manage Pages and Features window in the Visual Design Studio.
3. Navigate to the Page you’d like to tag, then select Tag Page in the bottom-right corner of the modal.
4. View the Suggested Page Title Match, which looks at the document_title attribute. This is often sufficient for your Page rule if you have access to the document title or have comprehensible URLs. If the Page rule meets your needs, skip to step 5. If the suggested Page title doesn’t reflect your desired Page rule, then select Rule Builder to begin building your Page rule.
   • Each field label represents where the rule components derive from. The Domain field represents your web domain, url fields represent your current URL parameters, and ? represents each Page event property relevant on the page, always formatted as _pendo_propertyname=value.
   • Within each dropdown menu, you can choose what to do with each rule component to adjust the query parameters in your rule. For detailed guidelines on each of these options, see URLs for Page tagging.
5. Add additional include or exclude rules as needed, then select Save.
   

Tips from our Expert Services and Transformation Services teams: When you have the Suggested Pages app setting also turned on, we look at what Page event property values were returned and allow you to tag those Pages with a single selection in Product > Pages > Suggested Pages.

If your app has an unchanging URL or incomprehensible URLs, as well as an unchanging document_title, then Page event properties might be the only way to tag Pages in your application without requiring additional coding work from your development team. If your navigation menu indicates which section is currently active, then tagging the navbar.active CSS selector and specifying its value from an attribute of that element can get your Pages tagged. It typically works to return either the ariaLabel, innerText, or a custom data attribute.