Events or goals in MicroMetrics are interactions that you want to collect data on, in addition to page views. Actions like link clicks, form submissions and even e-commerce can be configured as events in MicroMetrics.
Table of Contents
Basic event configuration
Events can be tracked with the pa.track() Javascript function and support up to three data keys:
- Name (Required). It is the name of the event that will be displayed in the MicroMetrics report.
- Value (Optional). It is the quantitative value of the event. To apply decimals you must use the dot (.) as a separator.
- Unit (Optional). It is the type of currency, in case it has an assigned value. Applies the international standard ISO 4217.
Here are some examples of event scripts:
pa.track({name: 'Subscription'})
pa.track({name: 'Payment', value: 5.25, unit: 'EUR'})
You should be aware that any external resources that slow down or damage the page (javascript, CSS files, etc.) can affect the performance of your events.
A single javascript error can cause all javascript to malfunction on a page. Periodically check the browser console for javascript errors.
Examples of events in MicroMetrics
Page load events
If you want to analyze in more detail the most important pages of your website, you can trigger an event every time a page loads like this:
<script>
window.addEventListener('load', (event) => {
pa.track({name: 'Team'});
});
</script>
Link Click Events
There are two ways to fire an event when a link or any other element is clicked.
The first is to add an event of type onclick, like so:
<a href="/contact" onclick="pa.track({name: 'Contact'});">Contact</a>
The second is to target one or all elements with a specific ID or CLASS on the page. If you use this method, always make sure that the script must come after the last ID or CLASS, or it won’t work.
Following the example above, if you want to fire an event every time a visitor clicks the link, you would set it up like this:
<a href="/contact" id="contact">contact</a>
Next, add the following script just before the </body> element.
<script>
window.addEventListener('load', (event) => {
document.getElementById('contact').addEventListener('click', () => {
pa.track({name: 'Contact'});
});
});
</script>
Form submission events
As we saw earlier with links, there are two methods to trigger an event when submitting a form.
If you can edit the HTML of your form, you can trigger an event of type onsubmit, like so:
<form method="post" onsubmit="pa.track({name: 'Contact'});">
If you can’t edit the HTML of your form, but it contains an ID or CLASS like the following:
<form method="post" id="Contact">
You can then add the following script just before the </body> element:
<script>
window.addEventListener('load', (event) => {
document.getElementById('contact').addEventListener('submit', () => {
pa.track({name: 'Contact'});
});
});
</script>
E-commerce events
If you want to record the transactions of your e-commerce, in addition to the amount of the orders, you can include the following script when the order confirmation page is loaded:
<script>
window.addEventListener('load', (event) => {
pa.track({name: 'Payment', value: 10.99, unit: 'EUR'});
});
</script>
404 error events
If you want to record the pages that cause a 404 error on your website, you can include the following script when the 404 error page loads from your template:
<script>
window.addEventListener('load', (event) => {
pa.track({name: '404 ' + document.location.pathname});
});
</script>
Outbound Click Events
If you want to record outbound-link-clicks of your website to know which pages your visitors go to, add the following script just before the </body> element:
<script>
document.addEventListener('click', function (event){
if(event.target && event.target.href && event.target.host && event.target.host !== location.host){
pa.track({name: 'Outbound ' + event.target.href});
}
});
</script>
Search Events
If you want to record internal-searches on your website for To know what terms your visitors are using in their searches, add the following script just before the </body> element. Don’t forget to modify the query parameter of this snippet to the one you use on your website, for example in WordPress it’s “s”:
<script>
window.addEventListener('load', (event) => {
const urlParam = new URLSearchParams(window.location.search);
pa.track({name: 'Search: ' + urlParam.get('s')}) ;
});
</script>
WordPress Event Tracking
If you want to measure events and your website works on WordPress hosted, you can save a lot of time with our plugin now which makes it easy to create events from the admin panel without having to touch any code.
Note on the use of personal data
Be sure to not include any personally identifiable information in any event you submit to MicroMetrics. This may include, but is not limited to, name, email, phone number, user ID, or IP address.
By including any of the above data, you would be violating our terms and conditions, in addition to violating the GDPR if you have not expressly requested the user’s consent to collect it, and you run the risk of having your account deleted.