Ali Jafarian

Mixpanel is a great tool for tracking user behavior on your website or app. Today we’ll learn how to capture custom click events!

I use Mixpanel to capture custom click events on most of my sites. For example, you might want to track when users click specific CTA buttons, which you can then tie back to your conversion tracking.

Note – this tutorial assumes you’ve created a Mixpanel account and added their tracking script.

Mixpanel Click Event Tracking

This is a small snippet of jQuery that allows you to track user clicks globally by using a CSS class and data-attribute.

The jQuery

First, add this somewhere in your global scripts.

// Track any click with .mp-click-track CSS class
$('.mp-click-track').on('click', function () {
	// create variable from data-event-name attribute
	eventName = $(this).data("event-name");
	// record Mixpanel event

Then, add the mp-click-track class and data-event-name attribute to the element(s) you want to track. For example:

<a href="/" class="mp-click-track" data-event-name="Homepage click">View Homepage</a>

That’s it – simple and effective click event tracking for Mixpanel.


Leave a Comment

Your email address will not be published. Required fields are marked *