Analytics
If you need a hand implementing this, let us know!
Events
Events allow you to track specific user interactions on your website that are unique to your business needs. These events provide insights beyond standard analytics, enabling you to understand how users engage with your website at a more granular level. Custom events are user interactions with content that can be tracked independently from the standard pageview.
Implementing Custom Event Tracking Code
Key Components
- Event Key
key
:
- Purpose: This key acts as the primary label that will be displayed in our UI.
- Usage: Choose a descriptive and recognizable key for each event, as this will be the primary identifier.
- Additional Event Attributes:
- Purpose: These attributes provide extra details about the event.
- Usage: These details allow you to filter and refine analytics data. For example, if you were tracking clicks on a social share button, you may want to additionally log which social media platform was clicked.
Example Breakdown
JavaScript
window.fullres ||= {events: []};
window.fullres.events.push({ key: 'socialShare', whichSocial: 'facebook' });
-
Initialization:
- The first line ensures
window.fullres
is defined and has anevents
array.
- The first line ensures
-
Event Logging:
- The second line logs the event.
key: 'socialShare'
:- This is the label you will see in our UI.
- It identifies the type of event.
whichSocial: 'facebook'
:- This is an additional event attribute.
- It specifies the social platform used in this event.
Practical Use
When you log an event like this, our system will display socialShare
as the event label. You can then filter these events by the whichSocial
attribute to see events specifically related to Facebook.
Customizing Events
Feel free to add more attributes to capture other relevant details. For example:
window.fullres.events.push({ key: 'socialShare', whichSocial: 'twitter', isLoggedIn: true });
Here, isLoggedIn
is another additional event attribute you can filter by.
Summary
key
: The main label seen in the UI.- Additional event attributes: Filterable details to refine your event tracking.
Verifying and Testing Custom Events
-
Test the Implementation: After implementing the code, test it by performing the action on your website (like clicking the button or submitting the form).
-
Check Analytics Dashboard: Log into your Analytics dashboard to ensure that the event is being captured correctly. It might take a few minutes for the event to show up in the reports.
-
Debug if Necessary: If the event is not being tracked, recheck the code for errors, ensure that the analytics tracking code is correctly installed, and the event tracking code snippet is properly configured.
Additional Ideas For Inspiration
-
Button Clicks
- Event Key:
buttonClick
- Attributes:
buttonID
,buttonText
window.fullres.events.push({ key: 'buttonClick', buttonID: 'subscribeButton', buttonText: 'Subscribe'});
- Event Key:
-
Newsletter Subscription
- Event Key:
newsletterSub
- Attributes:
formID
,formName
window.fullres.events.push({ key: 'formSubmit', formID: 'newsletterForm', formName: 'On leave overlay modal' });
- Event Key:
-
Form Submissions
- Event Key:
formSubmit
- Attributes:
formID
,formName
window.fullres.events.push({ key: 'formSubmit', formID: 'contactForm', formName: 'Contact Us' });
- Event Key:
-
Video Plays
- Event Key:
videoPlay
- Attributes:
videoID
,videoTitle
window.fullres.events.push({ key: 'videoPlay', videoID: 'introVideo', videoTitle: 'Introduction to Our Service'});
- Event Key:
-
File Downloads
- Event Key:
fileDownload
- Attributes:
fileName
,fileType
window.fullres.events.push({ key: 'fileDownload', fileName: 'whitepaper.pdf', fileType: 'pdf'});
- Event Key:
-
E-commerce Events
- Event Key:
addToCart
- Attributes:
productID
,productName
,quantity
window.fullres.events.push({ key: 'addToCart', productID: '12345', productName: 'Product Name', quantity: 1});
- Event Key:
purchase
- Attributes:
orderID
,orderValue
,currency
window.fullres.events.push({ key: 'purchase', orderID: '67890', orderValue: 99.99, currency: 'USD'});
- Event Key:
-
Error Tracking
- Event Key:
error
- Attributes:
errorMessage
,errorURL
window.fullres.events.push({ key: 'error', errorMessage: '404 Not Found', errorURL: window.location.href});
- Event Key:
-
User Sign Up
- Event Key:
signUp
- Attributes:
userID
,userEmail
window.fullres.events.push({ key: 'signUp', userID: 'user123'});
- Event Key:
Frequently Asked Questions
1. Are these attributes fixed, meaning Fullres currently looks for these exact ones, or can they be anything?
The attributes are flexible and can be anything that makes sense for your tracking needs. You are not limited to the examples provided. For instance, you can use formClass
instead of formID
:
window.fullres.events.push({ key: 'formSubmit', formClass: 'signupForm', formName: 'Newsletter Signup' });