Analytics

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

  1. 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.
  1. 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 an events array.
  • 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

  1. Test the Implementation: After implementing the code, test it by performing the action on your website (like clicking the button or submitting the form).

  2. 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.

  3. 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

  1. Button Clicks

    • Event Key: buttonClick
    • Attributes: buttonID, buttonText
    window.fullres.events.push({ key: 'buttonClick', buttonID: 'subscribeButton', buttonText: 'Subscribe'});
    
  2. Newsletter Subscription

    • Event Key: newsletterSub
    • Attributes: formID, formName
    window.fullres.events.push({ key: 'formSubmit', formID: 'newsletterForm', formName: 'On leave overlay modal' });
    
  3. Form Submissions

    • Event Key: formSubmit
    • Attributes: formID, formName
    window.fullres.events.push({ key: 'formSubmit', formID: 'contactForm', formName: 'Contact Us' });
    
  4. Video Plays

    • Event Key: videoPlay
    • Attributes: videoID, videoTitle
    window.fullres.events.push({ key: 'videoPlay', videoID: 'introVideo', videoTitle: 'Introduction to Our Service'});
    
  5. File Downloads

    • Event Key: fileDownload
    • Attributes: fileName, fileType
    window.fullres.events.push({ key: 'fileDownload', fileName: 'whitepaper.pdf', fileType: 'pdf'});
    
  6. 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'});
    
  7. Error Tracking

    • Event Key: error
    • Attributes: errorMessage, errorURL
    window.fullres.events.push({ key: 'error', errorMessage: '404 Not Found', errorURL: window.location.href});
    
  8. User Sign Up

    • Event Key: signUp
    • Attributes: userID, userEmail
    window.fullres.events.push({ key: 'signUp', userID: 'user123'});
    

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' });