Complete guide to event tracking

Event tracking is the first step in getting insights into your customers' behavior on your website or application. This tutorial addresses both step-by-step, walking through setting up autocapture, then diving deeper into custom events, and finally refining those custom events to capture the right data you need.

Complete guide to event tracking

Setting up autocapture

Autocapture makes it easy to start getting data such as page views, clicks, and submissions from your site through a Javascript snippet. It doesn’t require setting up individual events and automatically captures data from new or changed components. This is useful, for example, if you restructure your frontend, autocapture continues to collect relevant events without you needing to update your codebase.

To set up autocapture:

1. Go to “Sources”

2. Create a “Web tracker”source

3. Under “Insert a code snippet,” copy the code block snippet containing the script tags and Javascript function.

4. Paste the first block into your site’s HTML in the <head> tags and the second one under the <body> section. This should be an HTML page that acts as a base or template page (with other scripts your page loads) to ensure all possible events are captured.

This allows autocapture to capture events like clicks, change of inputs, or submission of a, button, form, input, select, textarea, and label tags. Once set up, those events flow automatically into PostHog for you to see and analyze. 

For a detailed guide on how to install the snippet, read our installation guide.

Autocapture’s limitations

Although we are proud of our autocapture feature, we know it isn’t enough for more advanced product analytics. This is for two reasons.

First, event autocapture can be overwhelming. In high-volume instances, where events come in at a high rate, the live events table can contain so much information it can be difficult to determine exactly what you care about. Remember that every click, change of input, or submission is tracked here. Without proper filters, actions, and insights set up, this data can be overwhelming.

Second, autocapture is a general solution that provides value to many users. To get the most out of Intempt, you should be using custom events. Custom events let you track exactly the behavior you care about, ranging from a user hovering input to a function call in your backend.

Setting up custom events

To expand on autocapture, you can create and add custom events to your website or application. Custom events allow you to capture details from anywhere in the codebase, whether it is a button press on the frontend or a class method call on the backend. This ensures correct and comprehensive data capture.

To set up custom events, first, you need to install the Web tracker on your site (as indicated in the previous section). Next, you will need to create a collection in the Web tracker you created.

Intempt uses Avro schemas to structure data - this ensures that all ingested events are validated against the schema structure in the database. This is an advantage compared to schemaless architecture allowint to ensure proper data validation in all cases (so no wrong or broken events are ingested).

However, this also means creating event collection schemas are required to be created in advance to start ingesting custom events. Please note that tracked events have schemas already pre-created - so it does not need this step.

To create the collections for customer events, you need to:

1. Map the schema of the event your want to track

Example of the mapped schema is below. You can read here to learn more about building a tracking plan.

2. Create an event collection in the Intempt console using the schema editor

Open the Web tracker source and select the “Collections” tab. 

Create a new collection - name it based on the event you want to create.

Add fields for each of the properties you mapped in the previous step (event schema).

Important:

  • Add a visitorId field and set a profile identifier as one of its properties. 
  • Make sure to also add an eventId to your schema - each event needs to have its unique identifier.

See our developer documentation for more information.

Note that Data type sent should match data type set when creating the collection. For instance, We are sending a property timestamp which has a Data type of number, Sending data with a type of string instead of number will prevent this event from being tracked.

3. Add tracking code to your codebase to track the custom event

You can log a custom event by calling Intempt's recordEvent function, passing in a set of key-value pairs.


  

The COLLECTION_NAME refers to an event type. For example, if you wanted to log every purchase made on your site, you might call that collection "purchase". Then, when a purchase happens, you call track and pass in the purchase details.


In the example below, we have a custom event with the name of purchase, then we have an object of key-value pairs. The pairs passed into the fields are the same as those created in the source collection.


In the another example below, the code snippet captures user sign-up data, such as their first name, last name, email, and discount card number. 



When the "regBtn" is clicked, the data is extracted from the input fields and passed as an object to Intempt's "recordEvent" function. The data is passed to Intempt as an object and includes the user's first name, last name, email, and discount card number.

Using event listeners

To track each custom event when it occurs, you need to use event listeners.

Event listeners are used in detecting user interaction with specific elements on the webpage, such as a button or a form input. In the code snippet example,, the "click" event listener is used to detect when the user clicks the "regBtn" or "loginBtn" button, respectively. When the event is detected, the function specified in the event listener is executed.


Getting custom events right

With some custom events being sent, it is time to refine those events to capture the data you want. Getting this right requires multiple steps.

  1. It starts with the goals of the product, which inform what data is needed about users and their behavior.
  2. Next is ensuring data is accessible in the right places in your codebase. This might require writing helper functions for access or formatting the data correctly.
  3. Finally, ensuring all the data is captured and added to Intempt for use in your analysis, visualization, and optimization. This is where we’ll focus for the rest of this tutorial.

There are multiple places where more details can be added to events to make sure you are tracking the right data. Here are some key ones.

Identifying users

To best capture data about users, you must understand who those users are. Autocaptured events identify users for you, while custom events require manually setting that user identification. 

Examples of identifiers for users include session IDs and emails. For example, getting identifying a user by email using Javascript is as simple as calling intempt.identify() with a unique identifier.

To track visitors across multiple browsers and apps (or sessions after cookies are removed), pass in a unique identifying string (user email, unique user ID in your database etc.).

Identifying users helps understand who those users are and what they are doing. Once identified, Intempt connects events related to formerly anonymous IDs with the unique set IDs. 

An example below is when the same identifier was used across two different sources. For this user, Intempt got a unified view of all of the events across the Shopify and iOS demo sources.

Combining events

Often a single event does not make up an entire behavior that you want to track. For example, a signup can include not only pressing the signup button, but entering the correct information and making it past the basic information input stage. To truly track all the events and behaviors, events can be combined into defined events.

Defined events can be created by using the Intempt Event editor - autocapture events, custom events, and page views can then be combined to better track the behavior you care about. You can find more about using the event editor here.

Note: Defined events also work retroactively, meaning they also tag events that happened in the past, not only events that happened after the action was created.

What’s next?

Now that you have set up autocapture, high-quality custom events, and actions, what’s next? If your website or application is active (we hope it is), you’ll be getting a flow of data into your Intempt instance. You can continue to expand the capturing and formatting of that data or you can begin to analyze it. 

If you are looking for more options for where to send your events that aren’t covered by our client-side libraries, you can check out our API.

If you are looking to get started with the analysis of all the event tracking data you now have, you can look into creating a new report or explore our templates library to get inspiration on how to use Intempt.

Whenever you're ready, there are 4 ways Intempt can help you:
1. The Growth OS: We've combined our extensive knowledge of marketing and sales tactics to create the GrowthOS, ushering in a new era of lean, focused, and profitable internet businesses. Over 150 internet businesses are on our waitlist. Join them, and after your trial period, receive $500 in credits.
2. The Intempt Startup Program: This program accelerates startups in eCommerce, SaaS, and Apps. It teaches founder-led and small marketing teams how to acquire, engage, and retain customers. Participants receive a $5000 credit for growth at no cost. Plus, if you refer your accelerator to us and they join our Affiliate Program, we'll double your credits.
3. The Intempt Affiliate Program: Accelerators and incubators can offer the Intempt Startup Program to their communities. Your startups will benefit from our program, and you'll receive a 20% revenue share.
4. The Intempt Agency Program: If you're a CRO agency, consider joining our Agency Program. You'll learn cutting-edge strategies for acquiring, retaining, and monetizing accounts (for SaaS companies) and users (for eCommerce & SaaS companies), implementing Intempt on behalf of eCommerce, SaaS, and Apps companies.
Subscribe to AI Marketer 🔮
Get our newest weekly workflows and resources for Marketing Orchestration & Sales Intelligence
You did it! 🥳 Keep an eye on your email
for new content from us!
Oops! Something went wrong while submitting the form.

Looking for ways to grow faster?

Discover marketing workspace where you turn audiences into revenue.

Learn about Intempt

You might also like...

‍Beware the AI Hype: Avoiding Traps in Marketing
Marketing Orchestration

‍Beware the AI Hype: Avoiding Traps in Marketing

From the myth of full automation to the risks of data overload and creative complacency, we tackle key challenges and misconceptions. Discover how AI can amplify, not replace, human ingenuity in marketing strategies, and learn to navigate potential biases.

read more
Complete guide to audience segmentation
Marketing Orchestration

Complete guide to audience segmentation

The value of customer segmentation can lend to everything from decreasing CAC to increasing customer loyalty all while building better, more personalized customer experiences. In our comprehensive guide, we break down what customer segmentation is, the business value, and the different ways you can automate segmentation using Intempt.‍‍‍

read more
Propensity scoring guide for B2B SaaS
Sales Intelligence

Propensity scoring guide for B2B SaaS

When we look at lead & account data, we’re focused on the past. How did we do last quarter? What happened in H1 2023? And how does that compare to H1 2022? How fast did accounts X, Y, and Z convert? Data becomes more valuable when we use it to predict the future instead of just analyzing the past. That’s where propensity scoring comes in.

read more

Subscribe to AI Marketer 🔮

Get our newest weekly workflows and resources for
Marketing Orchestration & Sales Intelligence

You did it! 🥳 Keep an eye on your email
for new content from us!
Oops! Something went wrong while submitting the form.

Web A/B testing

Use front-end A/B and multi-page experimentation product built for any business size. Run multiple experiments on the same page.

Targeting & personalization

Deliver targeted messaging, personalized offers and recommend the most relevant content for your users.

Visual editor

Empower your team to collaborate with an easy-to-use visual editor without using developer time to get things up and running.

Analytics

Gain insight into the impact of your experiments with statistically valid results. No complex statistical analysis required.

Server & client-side testing

Go beyond client-side testing and deploy experiments on the server-side. Test and optimize content changes and even complete re-brands.

Flexible goal selection

Select the right goal for each personalization and experimentation campaign to ensure you’re optimizing towards the right objectives.