Creating General Tracked Events in Insights
Brief Overview
This article explains how to create a general Tracked Event. To learn about what Tracked Events are, please refer to the About Insights Tracked Event article.
Tracked Events Page Overview
- + NEW EVENT
- Create, edit or delete a Tracked Event
- Tracked Events Summary Table
- a — Type: Each event has a different icon that corresponds to its type
- b — Name: This is the name the event’s creator gave to the Tracked Event
- c — Definition: This is the criterion that must be met before the Tracked Event is considered to have occurred
- d — Created: This is the date the Tracked Event was created
- e — Modified: This is the date the Tracked Event was last modified
Creating a Tracked Event
Method 1 – Capture Event
Prerequisites
- The WalkMe Editor Extension and Editor App must be installed
- You are logged into the WalkMe Editor with your Insights user account
- A settings publish has been performed
Instructions
- Log into your account at insights.walkme.com
- Click Tracked Events from the side menu in Insights
- Click the CAPTURE EVENT button:
- Please note: If the “Capture Event” button is greyed out, this means that DXA is not yet enabled on the account – Please reach out to your Admin to have the setting turned on so you can begin using this feature per the Insights Digital Experience Analytics (DXA) Level article
- Choose a page to navigate to (where the element exists) and click the LET’S GO button:
- Capture the target element and review the data provided about the captured element and fine-tune the settings if needed:
- Note: You will see a message indicating whether or not data already exists matching the definition
- Note: You will see a message indicating whether or not data already exists matching the definition
- Click DONE
- You will be automatically redirected to Insights, where you will see your new Tracked event
Editing a Tracked Event
When you hover over a Tracked Event you will see the following options:
- Copy button – to duplicate and create a new, similar Tracked Event
- Trash icon – to delete a Tracked Event
- Pencil icon – to edit an existing Tracked Event
- You will be prompted to confirm you want to apply changes if there are items that will be affected by the changes
- You will be prompted to confirm you want to apply changes if there are items that will be affected by the changes
- Recapture Tracked Event button – to edit the Tracked Event by recapturing the target element
Method 2 – Custom Setup
Alternatively, you can manually configure a tracked event by clicking the “CUSTOM SETUP” button:
- Type your new Tracked Event’s name into the name field
- Pro-Tip: Use a naming convention that indicates the user action the Event represents
- Select your Tracked Event’s definition from the Definition drop-down menu (see Available Event Types section below)
- Select any desired properties to help define the Event (see Available Event Types section below)
- Click + ADD PROPERTY under the Event Properties section (optional—only available for click or input-type events)
- Click SAVE and you’re done!
The new Tracked Event is now available to be used in Funnels, Features, and Filters.
Available Event Types
Event Type | Brief Description | In-Depth Definition |
Click/Tap | Filter by an element that is clicked or tapped |
Elements can be identified using the following: Text is: Identify the clicked element by its content. id: Identify the clicked element by its unique element identifier. class: Identify the clicked element by one or more classes. For more precise results use spaces to also identify a parent element’s class. For example, “.shippingForm .saveBtn “ CSS selector – read more below |
Page View | Filter by a specific URL a user visits | |
Input | Filter by input fields a user interacts with |
Input fields can be identified using the following: Name is: Identify the input element by the input field name label is: Identify the element by the input field name Class: Identify the input element by one or more classes. Id: Identify the input element by its unique element identifier. CSS selector – read more below |
Creating Event Properties
For certain types of Tracked Events (e.g., click/tap and input-type events), you can add event properties. Event properties record what URL the user is on when the event in question occurs (excluding the Page View event type, which already filters events by what URL the user is on).
For example, imagine you’ve created a new Tracked Event called “User Completed Purchase,” and you’ve defined the event as occurring when a user clicks the Place Order button with the HTML ID attribute of “place_order,” which is available on multiple pages.
You can now add an event property that checks whether the page on which the event occurred contains a particular URL, e.g.: “http://shopme.walkme.com/checkout.”
This way the Tracked Events will only count clicks occurring on this element on this specific page only. Otherwise, clicks from all pages would be counted toward the Tracked Event.
CSS Selectors
CSS selector allows a precise definition of an element to be tracked. CSS selectors allow you to identify elements in the HTML structure based on their characteristics such as id, class, type, attributes, or values of attributes.
How to Use/Build/Create CSS
- Find the element in the HTML by right-clicking on the element and selecting Inspect Element. The element will be highlighted on the screen and in the developer panel. Identify the element’s unique characteristics (such as location, class, id, and additional attributes) in order to build your CSS selector.
- Once identified, build your CSS selector. Currently, this is the supported CSS subset:
Supported CSS Attributes | Syntax | |
Id | The hash selector is used to specifically define an element based on its id attribute | #IdName |
Class | The dot is used to specifically define an element based on its class attribute | .className |
Additional attributes [attribute=’value’] |
tagName, src, href, type, name, Role, Text |
Equals: [attribute=a]Contains: [attribute*=b] Begins with: [attribute^=a] Ends with: [attribute$=c] |
The attribute selector is used to specifically define an element based on any of its HTML attributes. By default class and Id attributes are being collected. In order to collect additional HTML attributes, “this should be enabled in the environment settings → collection enablement section. |
||
Tag name | Name | |
Space – Elements hierarchy | The space is used to define hierarchy between elements. ‘.className .className’ | |
Combination of the above | #idName. className. className |
example: #idName. className. className |
Testing Your CSS Selector
-
- When defining a Tracked Event, Insights will immediately generate a preview of the results from the past 30 days until now, meaning it gets updated by the minute. This allows you to understand if any events have already been captured for this definition.
- To verify you identified the correct event as a Tracked Event, you should review the past months’ usage for this definition. If you receive zeros as your results, something in the definition might be faulty.
- You can also simulate the event on your website and verify it was tracked in real-time.
- When Sessions Playback is enabled, you can simply watch a session that the event appears in.