Step by step integration tutorial

This integration tutorial is for websites and web applications. If you are instrumenting something else (mobile, flash, backend) you can follow along, but please see our integration libraries as well.

Get streams working

Streams are the most basic, "out of the box" Mixpanel report. Just navigate to the "streams" tab to find your customized Javascript. Paste the Javascript snippet onto every page you want to track immediately before the closing </head> tag.

You should copy the individualized code found on your streams page. Or head over to our Javascript integration page and replace YOUR_TOKEN with your project's token.

Once streams integration is working, take the time to click around a few pages of your site. You should see at least one user in your "Users" tab:

A stream report showing one user. You can click on the "Stream" tab to see the histories of your most recent users as well.

Get an event up

If you click on the other tabs you'll see that, despite your streams integration, Mixpanel isn't displaying any data in the other reports! This is because all the other reports are event driven. An event is anything a user does that you consider important. For example: visiting a landing page. To send an event to Mixpanel whenever anyone visits a landing page, add the following code to all your landing pages. We recommend putting it between the </head> and </body> tags:

<script type="text/javascript">
    mpq.track("Landing Page Loaded")
</script>

You can name your event anything you want. It is important to be both descriptive and succinct, because the way you phrase it in your code will be how it appears on the Mixpanel website:

The above chart shows a single "Landing Page Loaded" event.

Get a funnel built

You can use funnels to see how many of your users complete a sequence of events. Imagine you were Twitter and you wanted to see how many people Tweeted after logging in. You'd send an event for a succesful login and a tweet.

Each of these steps can be set up as a Mixpanel event:

• On the main page after logging in, send the successful login event:

  <script type="text/javascript">
      mpq.track("Logged in")
  </script>
  

• After the user Tweets, send a tweet event:

  <script type="text/javascript">
      mpq.track("Tweeted")
  </script>
  

Once you are sending two or more events to Mixpanel you can arrange them into a funnel to see how many who do the first event also do the second:

Building a funnel in the Funnel report.

Viewing a funnel. In this example 43% of users tweet after logging in.

Caution

This tutorial uses example events that may not be right for your website. Choose the events you send carefully. Below find resources on choosing the right events.

• Integration: Best practices