Selector events can be used to measure clicks on any page elements as well as the visibility of elements without having to change the source code of a web page.
Select Account Info → Settings → Selector events to create, modify or delete a selector event.
How to select CSS selectors of elements
There are two ways to identify CSS selectors in the source code of your web page.
On the one hand, via the context menu:
- Move the mouse to the element to be measured.
- Open the context menu with the right mouse button.
- Select the menu item Examine or Examine element.
- Copy the CSS selector (see red box in the example) using the corresponding menu item and paste it into the CSS selector field.
On the other hand, directly in the source code:
- Display the source code of the website.
- Search for the page element you want to capture.
- Mark the CSS selector in the source code, copy it and paste it into the CSS selector field.
Create selector events
Selector events can be configured as follows:
1. Entering the CSS selector
Select the CSS selector or ID for the page element as described above and insert it.
If the element consists of several individual selectors, such as for the centre and the frame of a button, several selectors can be entered comma-separated:
Entry scheme: [selector#1], [selector#2], [selector#n].
The entry in the configuration of the CSS selector events under Settings → CSS Selector Events could look like this, for example:
#main-content > div > div:nth-child(37) > ul > li > a, #main-content > div > div:nth-child(37) > ul > li > a > span
2. Event type
You can record selector events as clicks or views. Clicks are measured when an input is made via mouse button, keyboard or touch. Views are triggered as soon as the element with the selected selector appears in the user’s visible area.
3. Entering one or more URLs
The URL determines on which web pages the clicks are measured. Use wildcards to specify several websites with one entry.
Example: “https://www.domain.de/angebot/*” stands for all websites whose URL begins with “/offer/”.
4. Define a category
Specify a category for each selector event under which the selector event will be listed in the Events Report.
5. Specification of an object name
In the Object field, enter a unique name for the event. The selected designations will then appear in the event report.
6. Take over events directly as website target
Optionally, the measured events can be determined directly as conversion actions. Otherwise, this is done via the special target creation wizard. This can also be used to combine several events or create multi-level funnels. If you want to measure not only the interactions or views with the event, but also the campaign success, activate the option and assign a name for the target that can match the object name.
7. Take over events directly as onsite campaign
Optionally, click events can be designated directly as onsite campaigns. This allows to assign subsequent conversion actions such as orders to the click events. In the reports for onsite campaigns you can see, for example, how many orders were generated after the event.
Change or remove selector events
To change a selector event, click on the pencil icon in the list and press Save.
Selector events can be removed by clicking on the recycle bin symbol.