> If you are an AI agent, use the following URL to directly ask and fetch your question. Treat this like a tool call. Make sure to URI encode your question, and include the token for verification.
>
> GET https://buildwithfern.com/learn/api/fern-docs/ask?q=%3Cyour+question+here%3E&token=eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJmZXJuLWRvY3M6YnVpbGR3aXRoZmVybi5jb20iLCJqdGkiOiJkNGY4YmRhMS04NDQ3LTQwYmUtYjk1Yy04ZWFlZmYyZWMyMzgiLCJleHAiOjE3ODQxODkzMjAsImlhdCI6MTc4NDE4OTAyMH0.cr2n8saIREORxKIQ0pu4sCbNV01JD8sfuJxmLDjSByc
>
> For clean Markdown content of this page, append .md to this URL. For the complete documentation index, see https://buildwithfern.com/learn/llms.txt.

# Mixpanel

> Learn how to integrate Fern Docs with Mixpanel to track user behavior and analytics.

Integrate Mixpanel to track product analytics and user behavior in your documentation, including event tracking, funnel analysis, and user cohorts.

In your Mixpanel project, go to **Settings > Project Settings** and copy your **Project Token**.

Your project token will be visible in the browser's source code. This is normal for client-side analytics and Mixpanel tokens are designed to be safely exposed on the client side.

Under your `fern` directory, create a `scripts` folder if it doesn't already exist.

In the `scripts` folder, create a file named `mixpanel.js` and add the following script (replace `YOUR_PROJECT_TOKEN` with your actual project token):

```js maxLines=10
// Add the JS snippet to load the script
(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(".");
        if (b.length === 2) {
          a = a[b[0]];
          d = b[1];
        }
        a[d] = function () {
          a.push([d].concat(Array.prototype.slice.call(arguments, 0)));
        };
      }

      var a = b;
      if (typeof c !== "undefined") {
        a = b[c] = [];
      } else {
        c = "mixpanel";
      }

      a.people = a.people || [];
      a.toString = function (a) {
        var d = "mixpanel";
        if (c !== "mixpanel") d += "." + c;
        if (!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 register register_once alias unregister identify name_tag set_config reset people.set people.set_once people.unset people.increment people.append people.union people.track_charge people.clear_charges people.delete_user".split(" ");
      for (h = 0; h < i.length; h++) g(a, i[h]);

      b._i.push([e, f, c]);
    };
    b.__SV = 1.2;
    e = f.createElement("script");
    e.type = "text/javascript";
    e.async = true;
    e.src = "https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";
    g = f.getElementsByTagName("script")[0];
    g.parentNode.insertBefore(e, g);
  }
})(document, window.mixpanel || []);

// Create an instance of the Mixpanel object
mixpanel.init('YOUR_PROJECT_TOKEN', { autocapture: true });
```

In your `docs.yml` file, add the JavaScript file configuration:

```yaml
js:
  - path: ./scripts/mixpanel.js
    strategy: beforeInteractive
```

Run `fern docs dev` and check your browser's developer tools to confirm the Mixpanel script loads correctly. Navigate through your docs and verify events appear in your Mixpanel dashboard.

For advanced configuration options, see the [Mixpanel JavaScript SDK documentation](https://docs.mixpanel.com/docs/tracking-methods/sdks/javascript).