You can use various approaches to select the elements you want to track in SkyGlue. The SkyGlue visual interface is easy to use and can track your desired HTML elements in most cases. If needed, you can also use any valid CSS selector to select the elements you want to track.
After you have selected the desired elements, you can either give them static event names or dynamic event names. See the details on options for event names
Visual interface-based HTML element selection
SkyGlue event tracking customization allows users to track HTML elements using any attribute for the HTML element or the structure location of the HTML web page (“RootPath”, which means the HTML element path from the HTML root node.)
Tracking using attributes for Simple Click Event
In this section, you can track any HTML element using the following attributes related to the HTML element.
- linkText (for A tag only)
Once you click on the HTML element, SkyGlue visual setup interface will show you the available attributes for simple event tracking under the “Attributes for Simple Click Event” section. If your HTML element does not have ID or name attribute, you will not see these two attributes.
Tracking using Attributes for Customized Click Events
If the “Attributes for Simple Event Tracking” can not uniquely identify the HTML element you want to track, you can use HTML attributes under the “Attributes for Customized click events” section. For this section, you need the HTML tag name (e.g. tag name like “A”, “INPUT”, etc). Besides the tag name, you will see more HTML attributes for the HTML element, such as class (used by CSS style), title, or ANY attribute in your HTML element.
Adding attributes to identify HTML elements or specify event names
With the attributes mentioned above, you should be able to track most of the HTML elements on your website. If you still cannot find a HTML element attribute that can uniquely and persistently identify your HTML element (or the element group), you can ask your website developer to add attributes to the HTML element that can uniquely and persistently identify the HTML element. You can see details here.
Advanced CSS-based selection approach:
If it is hard to select an element with the attributes in the SkyGlue visual interface, you can specify the elements you want to track using any valid CSS selector.
Use CSS selector to select one or more elements
You can add css: prefix to the CSS selector and add the selector in the “simple event tracking section”, for example: css:ul.submenu a. Following is a screenshot:
Select elements dynamically added after pageload
If an element is loaded after the initial page load, you can add a late: prefix in the CSS selector to specify that. SkyGlue will then try to match the element when new HTML elements are added to the web page. Following is an example screenshot.