Detect Any Action or Event Taking Place on Your Website!
With this new submodule, you are able to create your very own tags for any event you would like to be tracked, add them to your website and see how the firing of an event develops over time. You can also use the auto-tracking to scan your website for default elements (i.e. form inputs, buttons, images, checkboxes etc.) without having to add any extra code & track them right away. This feature helps you immensely in tracking events you specifically want to know.
Important Note: The Manual Event Tracking is not available for Wix websites (no custom tags can be created, as there is no control of the code for specific elements on the page). The Auto-Tracking will work.
This support article is structured into the following sections:
Just above the table you see a bar which enables you to choose a certain time range or even a day for which the data below should correspond to. It is important to constrain the displayment of data to certain dates or periods in which you ran potential campaigns or took other measures in order to measure how successful these actions were for future planning.
Whenever you feel like creating a new event tag in order to track whatever happens on your website, you can do this easily within the application. You can crate new tags from the Event tag generator button located next to Overview.
Important Note: The Manual Event Tracking is not available for Wix websites (no custom tags can be created, as there is no control of the code for specific elements on the page), but only the Auto-Tracking will work.
The event tag needs to be integrated within your source code afterwards in order to track the event you created the tag for. Please find instructions on how to add the event tag further below.
In general an event tag can be made of the following fields:
After you have defined the fields above, you can bind this new event tag to a certain action. They are shown to you in a dropdown. Choose the action you want the event to fire upon & click on the button "generate event tag".
Once you have generated your new event tag, you need to integrate it within your website, so that the application can track the firing of this event. Each created tag must be added within each individual element that you want to track.
It is pretty simple and there are various ways on how to do this (depending on the website builder platform). Below we have an example for HTML:
Edit your HTML source-code and add the Event Tag to your desired elements.
You can add the tag our app creates for your event, either as a JS snippet or directly on the element, as per the tutorial below.
Here is an example for a button in HTML and how it should look like so that the click on that button is tracked as an event:
<button id="important-btn">Click me!</button>
Option A: JS snippet
<script> document.getElementById("important-btn") .addEventListener("click", function(){ va("send", "event", "example-category", "btn-click", "Important Button") }); </script>
Option B: directly on the element
<h2 onclick="va('send', 'event', 'example-category', 'btn-click', 'important', 123);">Important button</h2>
Both options are semantically correct and do the same thing in the ideal case.
However, Option A allows for more flexibility. For example you could add a "visa-track" class to multiple elements and call the va method in a more dynamic manner by relying on JS capabilities.
The limitation with Option B is that it might be overridden by some other JS code that is loaded after the DOM is rendered ( element.onclick = function(){ ... } ), thus causing our code never to be called.
In comparison, Option A allows an unlimited number of event listeners to be added (as long as the memory on the user agent device can withstand it).
The setting feature allows you to get a basic overview of the fired events for some default static elements on your site. The settings menu is located within Website settings - Module settings icon on the left bar of the aplication screen.
Once accessed you will have available two types of settings: General Event Tracking Settings and Auto-Tracked Default Events.
1. For General Event Tracking Settings, you have the option to enable or disable Define Default Events for Auto-Tracking and
Track Manually Created Event Tags.
2. Auto-Tracked Default Events - here you can see what elements (input, select, text-area, button, radio, checkbox) on the site could be automatically identified with the current version, and the actions (onmouseover, onclick, keyup, onchange) that can be tracked on each:
Important Notes:
A Live Preview will also be available soon, so you can know exaclty what actions were triggered on which elements, viewing this directly within an image with your webpage itself.
Within the main table of tracked events, there is a "Show event on website" button, for the auto-tracked elements.
Click that and a preview of the page itself will be open in a new tab with the possibility to see important details about your auto-tracked events, in a more human readable way, than only the table of the tracked events you've been previously looking at:
The Preview Settings
Every row of this Settings Menu shows your defined settings and some of the auto tracked elements related information:
Important Notes:
This table gives an overview of all the events that have been fired throughout the selected period of time. Each line represents one firing of an event. So if the same event was fired 20 times in the selected period of time, then there would be 20 lines for this event.
The table contains the following columns:
The table allows various filter and grouping options. The main difference between filtering and grouping is relatively simple. By filtering you are reducing the amount of events shown within the table. Grouping does not reduce the number of events shown in the table but rather connects events by the field you are grouping them by. Play with it in the table and you will easily understand the difference. Both approaches give you simple yet powerful possibilities to display your data and retrieve interesting facts from it.
You can easily create filter templates for your set filter combinations. Once you have added a filter combination to the main table which you will probably re-use more often in the future, just click on the button.
The more filters you activate for the table above, the less events will be shown in the table. This will also reduce the amount of events reflected in the line diagram above.
It is important to note the behavior of the line diagram. Once you group data within the table above, you will see that if the user wants to see the line diagram of a specific group, he/she then needs set the filter upfront.