Quickstart
This path takes about two minutes and needs nothing but access to your site's <head>. The
first-party proxy, consent wiring and custom events are optional next steps.
1. Sign up and create a project
- Open the dashboard and sign up (or accept an invitation).
- The onboarding asks for your organization (prefilled from your e-mail domain) and your site URL. X3 creates a project for it: name, slug, own domains and time zone come from the URL and your browser – you can change them later under Settings → General.
- The project gets a publishable key (
pk_3x_…). It is public by design: it only allows sending events from the origins listed in the project's tracking config. - The guided onboarding continues with Tracking einbauen: the code below is shown there with your key, plus tabs per stack, a "Mit Claude Code einrichten" prompt and a live panel that turns green with the first pageview. Goals, ad platforms, conversions, Claude and your team follow as optional steps; re-open it any time under Settings → Setup-Status.
Prefer the terminal? The same steps work through the API (Authentication and keys) or through Claude (Claude Code).
2. Paste the snippet
Put this into the <head> of every page (replace the key and the API origin with the values the
onboarding shows you):
<script>window.x3=window.x3||function(){(window.x3q=window.x3q||[]).push(arguments)}</script>
<script async src="https://api.x3.example/v1/s/x3.full.js?k=pk_3x_YOUR_PUBLISHABLE_KEY" data-key="pk_3x_YOUR_PUBLISHABLE_KEY"></script>- The first line is a tiny queue: calls such as
x3("track", "signup")made before the script has loaded are kept and replayed. ?k=inlines the project's client configuration into the script, so the tracker starts without a second request.x3.full.jscontains every plugin (video, sections, forms, identify, consent adapters, booking adapters). Usex3.jsfor the smaller core; plugins then load on demand.
Using a framework? The framework recipes show the idiomatic place for the
snippet – for Next.js it is one component in app/layout.tsx.
3. Verify
Open your site in a normal browser window (not a headless browser – automated browsers are ignored on purpose), scroll a bit and click something. The onboarding page waits for the first pageview and shows it live; afterwards Open dashboard takes you to the overview.
Nothing arrives? Check, in this order:
- The browser's network tab shows
POST …/v1/ewith status 204. A 403 means the page's origin is not in the project's allowed origins (Settings → Tracking → Domains and origins);http://localhostneeds Allow localhost switched on. - The page is not opened with the opt-out parameter (
?x3_notrack=1stores an opt-out in this browser;?x3_notrack=0removes it). - An ad blocker may block the API host. That is what the first-party proxy is for.
More in Troubleshooting.
What is measured now
Without any further code: pageviews (including single-page-app navigation), sessions, channels and
campaigns, referrers, scroll depth and the fold, engaged time, clicks (links, buttons, CTAs,
WhatsApp, phone, e-mail, downloads, outbound), sections, <video> retention and form starts,
submits and abandons. Test traffic is marked with ?x3_test=1 and excluded from reports by default.
Next steps
| Goal | Guide |
|---|---|
| Survive ad blockers, keep visitor separation behind CDNs | First-party proxy |
| Respect a cookie banner or CMP | Consent |
| Track sign-ups, quiz steps, calculators | Custom events and presets |
| Measure conversions | Goals and funnels |
| See what your ads cost per relevant visit | Ad costs |
| Send leads to Meta, LinkedIn, Google, TikTok | Server-side conversions |
| Let Claude analyse your data | MCP server |