HTML element

If your URL structure does not allow you to easily target specific pages you can instead target based on a element selector. In other words check if a specific element exist on the page the visitor is browsing.

If your website has unique IDs or static class names for your elements this is the easiest way of targeting a specific type of page.

Example

Create Audience step 3 In the image above we target all pages that has a selector that is #addToCart (i.e an element with a ID of addToCart).

info

The Lyftio script monitors the website so this will also work for element that loads dynamically after first page load.

Setting condition without element IDs

If you do not have unique IDs you can still set a unique selector by setting a strict hierachyral selector.

...
<div class="col-6">
  <div class="details">
    <label for="quatity">Qty: </label>
    <input type="number" name="quatity" placeholder="Quantity" value="1" />
    <button>Add to cart</button>
  </div>
</div>
...

If you have the above structure you can for example set the selector to: .col-6 > .details > button to specifically target all pages that have a button that is a direct child of an element that has a class called details which itself is a direct child of an element that has a class called col-6.

tip

Always test your Audience in Preview before activating the experiment to make sure that your experiment only runs on pages that you intented.

Example​

Example