Skip to content

Simple setup with Mixpanel

Jump to bottom
Osvaldo edited this page Jan 6, 2026 · 2 revisions

IMPORTANT:

  1. Many websites use Mixpanel from Google Tag Manager. If this is your case you should read Using Abrantes with a tag management solution instead.

Your project token

First get your project token in Mixpanel.

In the <head>

First add a link to AbrantesPlus.js or even better to a minified version of it AbrantesPlus.min.js

<script src="AbrantesPlus.min.js"></script>

This script must also be in the <head>. Replace [PROJECT_TOKEN] bellow by your Mixpanel project token.

<!-- Paste this right before your closing </head> tag -->
<script type="text/javascript">
  (function(e,c){if(!c.__SV){var l,h;window.mixpanel=c;c._i=[];c.init=function(q,r,f){function t(d,a){var g=a.split(".");2==g.length&&(d=d[g[0]],a=g[1]);d[a]=function(){d.push([a].concat(Array.prototype.slice.call(arguments,0)))}}var b=c;"undefined"!==typeof f?b=c[f]=[]:f="mixpanel";b.people=b.people||[];b.toString=function(d){var a="mixpanel";"mixpanel"!==f&&(a+="."+f);d||(a+=" (stub)");return a};b.people.toString=function(){return b.toString(1)+".people (stub)"};l="disable time_event track track_pageview track_links track_forms track_with_groups add_group set_group remove_group register register_once alias unregister identify name_tag set_config reset opt_in_tracking opt_out_tracking has_opted_in_tracking has_opted_out_tracking clear_opt_in_out_tracking start_batch_senders start_session_recording stop_session_recording people.set people.set_once people.unset people.increment people.append people.union people.track_charge people.clear_charges people.delete_user people.remove".split(" ");
  for(h=0;h<l.length;h++)t(b,l[h]);var n="set set_once union unset remove delete".split(" ");b.get_group=function(){function d(p){a[p]=function(){b.push([g,[p].concat(Array.prototype.slice.call(arguments,0))])}}for(var a={},g=["get_group"].concat(Array.prototype.slice.call(arguments,0)),m=0;m<n.length;m++)d(n[m]);return a};c._i.push([q,r,f])};c.__SV=1.2;var k=e.createElement("script");k.type="text/javascript";k.async=!0;k.src="undefined"!==typeof MIXPANEL_CUSTOM_LIB_URL?MIXPANEL_CUSTOM_LIB_URL:"file:"===
  e.location.protocol&&"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js".match(/^\/\//)?"https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js":"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";e=e.getElementsByTagName("script")[0];e.parentNode.insertBefore(k,e)}})(document,window.mixpanel||[])

  
  mixpanel.init('[PROJECT_TOKEN]', {
    autocapture: true,
    record_sessions_percent: 100,
    api_host: 'https://api-eu.mixpanel.com',
    track_pageview: true,
  })

</script>

In the experiment

Mixpanel does not require an Abrantes Plugin. Instead of track, just create an event to start the experiment with

        mixpanel.track('run_ab_test', {
            'ab_test_data': MyTest.testId + "-" + MyTest.variant
        })

Replace MyTest above with your Abrantes object name. Please note you can do multiple experiments in the same page using different object names.

Goal of the experiment

You need to have a Mixpanel event to track the goal that includes the ab_test_data event propriety. This is very specific

Analytics

You can do your own analytics with the event and propriety described above. Basically:

  • run_ab_test ads someone to an experiment and the experiment name and variant are stored in the ab_test_data of the event.
  • Your event to track the goal should have the ab_test_data propriety as well.

Test your setup carefully before launching the experiment.

Using user proprieties

If your website uses identify users in Mixpanel, with the mixpanel.identifytag, like this example:

        mixpanel.identify('example_user_12345');

You can also store the experiment id and variant in the user's Mixpanel. The following example shows how to define the propriety from the experiment:

        mixpanel.people.set({
            'user_id_variant': MyTest.testId + "-" + MyTest.variant
        });

See the full Mixpanel example for more information.

Conclusion

Adding Abrantes to your entire website should be quite straightforward, specially if you already use Mixpanel and do the web analytics tracking with the tracking code.

Clone this wiki locally