Docs
Quickstart
Connect Your Data

Connect Your Data

You can use Mixpanel's SDKs to track events from your website, web application, or backend servers. We recommend server-side tracking, since it is more reliable and easier to maintain than web/mobile tracking.

Note: You'll need your Project Token to authenticate, which you can get here (opens in a new tab).

Step 1: Install the SDK

<!-- Paste this right before your closing </head> tag -->
<script type="text/javascript">
  (function (f, b) { if (!b.__SV) { var e, g, i, h; window.mixpanel = b; b._i = []; b.init = function (e, f, c) { function g(a, d) { var b = d.split("."); 2 == b.length && ((a = a[b[0]]), (d = b[1])); a[d] = function () { a.push([d].concat(Array.prototype.slice.call(arguments, 0))); }; } var a = b; "undefined" !== typeof c ? (a = b[c] = []) : (c = "mixpanel"); a.people = a.people || []; a.toString = function (a) { var d = "mixpanel"; "mixpanel" !== c && (d += "." + c); a || (d += " (stub)"); return d; }; a.people.toString = function () { return a.toString(1) + ".people (stub)"; }; i = "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 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 < i.length; h++) g(a, i[h]); var j = "set set_once union unset remove delete".split(" "); a.get_group = function () { function b(c) { d[c] = function () { call2_args = arguments; call2 = [c].concat(Array.prototype.slice.call(call2_args, 0)); a.push([e, call2]); }; } for ( var d = {}, e = ["get_group"].concat( Array.prototype.slice.call(arguments, 0)), c = 0; c < j.length; c++) b(j[c]); return d; }; b._i.push([e, f, c]); }; b.__SV = 1.2; e = f.createElement("script"); e.type = "text/javascript"; e.async = !0; e.src = "undefined" !== typeof MIXPANEL_CUSTOM_LIB_URL ? MIXPANEL_CUSTOM_LIB_URL : "file:" === f.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"; g = f.getElementsByTagName("script")[0]; g.parentNode.insertBefore(e, g); } })(document, window.mixpanel || []);
</script>

Step 2: Track your first event

import mixpanel from 'mixpanel-browser';
 
mixpanel.init("YOUR_TOKEN", {debug: true, track_pageview: true, persistence: 'localStorage'});
 
// Set this to a unique identifier for the user performing the event.
mixpanel.identify('USER_ID')
 
// Track an event. It can be anything, but in this example, we're tracking a Sign Up event.
mixpanel.track('Sign Up', {
  'Signup Type': 'Referral'
})

🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the Events page (opens in a new tab).

You can also follow our video walkthrough here (opens in a new tab).

FAQ

Does Mixpanel automatically track page views?

Yes, if you pass track_pageview: true in the mixpanel.init() call, Mixpanel will automatically track a "Page View" event every time a new page is loaded. Learn more here.

Why aren't my events showing up?

If tracking from web, make sure you've disabled ad blockers and your Do Not Track (DNT) browser settings are set to false when testing your JavaScript implementation. If the DNT setting is set to true, then Mixpanel won't collect information from that Mixpanel instance. We also recommend setting up a proxy server so that you don't lose events due to ad-blockers.

If tracking from a mobile device, events may take 1-2 minutes to appear because Mixpanel's mobile SDKs buffer events for 1 minute, or when the app transitions to the background, to conserve battery life and bandwidth. You can call .flush() in the mobile SDKs to manually flush events to Mixpanel.

How can I track in a privacy compliant way?

If a user opts out of tracking, you can call the .optOutTracking() method on any of our client-side SDKs; this prevents any subsequent data being tracked from that user's device. Learn more here.

For iOS specifically: Mixpanel does not use IDFA, so it does not require user permission through the AppTrackingTransparency(ATT) framework. For more details, refer to our Apple App Developer Privacy Guidance (opens in a new tab).

Does Mixpanel use third-party cookies?

No, our Mixpanel JavaScript SDK does not set or use any third-party cookies. If you wish to disable cookies entirely, you can set the disable_persistence option to true when initializing your Mixpanel JS instance. Note that disabling persistence will disable the use of super properties and anonymous -> identified user tracking.

What are the recommended configuration options?

When tracking on web, we recommend using localStorage, as this is more reliable:

mixpanel.set_config({ persistence: "localStorage" });

How do I connect events from logged out vs logged in users?

If tracking client-side, just call .identify(<user_id>) when a user logs in and .reset() when they log out. Mixpanel will automatically stitch the user journey across logged out and logged in.

If tracking server-side, check out our server-side best practices guide. For more information, read our comprehensive guide on Identifying Users.

Was this page useful?