Page content-based targeting relies on inspecting the HTML structure of the webpage. It enables you to:

  • Display content only when specific elements are present on the page.

  • Check the attributes or values of HTML elements to refine targeting.


Condition Name
Description
Element exists
Target content based on whether an HTML element exists on the page.

Provide a CSS selector (e.g., #element-id, .class-name) to define the element to check.

For example, show a tour only when a specific button or section is available on the page.

Element doesn't exist
Opposite of "Element exists" - target pages on which the specified element is not present.
Element text contains

Control content display based on the inner text of an HTML element.

Specify the text or a pattern (e.g., partial match, case-sensitive) to target elements dynamically.

For example, display a checklist when a notification element contains specific text (e.g., 'Your profile is incomplete').

This is also handy to detect different page languages or specific values displayed on a page.

Element attribute contains

Target based on the value of an element’s attributes.

Check if an element’s attribute (e.g., data-value, id, class) matches a specific value or pattern.

For example, show content when a form input field contains a certain value (e.g., data-status="complete").


These conditions are available in the Settings section when configuring Usetiful content.