How do I customize Autotrack Events by adding elements and Properties?

The Point & Click Editor gives you flexibility and full control over event tracking.

This page / all pages

When creating an event, click “this page” to toggle between tracking the event only on the current page and all pages where that element appears throughout your website:

alt text

Use “all pages” instead of just “this page” if, for example, your website features a buy button across every page, and you want to include all clicks of this button in your event no matter which page the user was on at the time.

Manage elements

Autotrack allows full flexibility to manage what elements on your website you would like to include as part of your event:

alt text

  • Automatically find similar: The Autotrack Point & Click Editor will automatically try to find similar elements on your webpage and group them under the same event. This is the default option; if you want to add elements that weren’t detected automatically or remove elements that were detected automatically, click on either Manually add elements or Customize selector to make modifications.
  • Manually add elements: Manually choose the elements you want to include in your event by selecting all the elements you would like to group together. If you aren’t interested in specific elements, you can remove these as well.
  • Customize selector: Use custom CSS selectors to easily define the elements in your event. For example:
    • If you wanted to select all “buy” buttons on the page:
      .site-header (.class)
    • If you wanted to select all links pointing to your own domain:
      a[href*="yourdomain"] ([attribute*=value])
    • If you wanted to select the entire navigation bar:
      #navbar (#id)

See a full list of all supported custom CSS selectors.

Default Properties

Properties are pieces of additional data that describe an event. For example, on an event called “View product details,” one might include properties such as the type of product viewed, the price of that product, the color of the product selected, etc. Or for an editorial business, an “Article read” event might include properties for the name or length of the article.

Mixpanel automatically collects some properties (like location and device information) by default with events, including Autotrack events. See a full list of all Mixpanel default properties.

Default properties collected with Autotrack events include:

  • Element Text: The text in the element associated with the event.

  • Element URL: The URL to where that element directs (where applicable).

  • Form field: [name]: Text associated with form's input field(s), where the fields themselves are the property and value(s) are the inputs.

On top of default properties, Autotrack also allows you to define your own properties.

Add custom properties

  • Click Properties +

  • Select an element to track as a property (note: the text from that element will become the property value):

alt text

  • Name the property

  • Click ADD

If you’d like to go back later and add properties to events you’re already tracking, you can do so by selecting the event from the “Your events” dropdown and following the same steps as above:

alt text