Install the pixel and send events
From snippet to first event on the timeline: first-party pixel installation, automatic events, custom events via _cl, and logged-in user identification.
The CrazyLeads pixel is a single script that collects pageviews, scroll depth, video and forms from your site — and delivers every event already resolved to a person, with identity unified across devices. This guide goes from zero to the first event on a timeline.
1. Create the Pixel source in your project
In the app, open Data Sources → Add source → Pixel. Enter your website domain (e.g. yoursite.com). The domain is a security gate: the pixel only runs on registered domains — on any other host it dies silently, so development environments never pollute your data.
2. Install the snippet
Paste the snippet before the closing <head> tag, on every page. The identifier in data-project is your project UUID — the app shows the ready-made snippet on the source screen with your ID filled in.
<script>
(function (w, d, s) {
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s);
j.async = true;
j.setAttribute('data-project', 'YOUR_PROJECT_UUID');
j.src = 'https://d1yai1huv6xqdp.cloudfront.net/tagPixel.min.js';
f.parentNode.insertBefore(j, f);
})(window, document, 'script');
</script>Single-page app (React, Next.js, Vue)? Nothing to configure: the pixel intercepts history navigation and emits a fresh pageView on every route change.
What is collected automatically
| Event | When it fires | What it is for |
|---|---|---|
| pageView | Every page seen (including SPA navigation) | Traffic, page funnels, attribution |
| Scroll | At 25%, 50%, 75% and 100% of the page | Real content engagement |
| Video | Player progress on the page | Who watched up to the pitch |
| Forms | Form submission carrying an email | Becomes identity: the anonymous visitor gets a name |
| UTMs and ad clicks | Arrival with utm_*, fbclid | Campaign attribution and Meta match |
3. Send custom events
The pixel’s public channel is the global _cl array, dataLayer-style: you push objects, the pixel processes them. It has replay — anything pushed before the script loads is processed once it does, so load order is never a problem.
window._cl = window._cl || [];
window._cl.push({
event: 'checkout_started',
plan: 'pro',
value: 297,
});Objects without the event key become super properties: they stick to every subsequent event from that visitor — good for context that lasts the session, like the page’s product or an experiment variant.
window._cl.push({ page_type: 'sales', product: 'Course X' });Sending events the right way
| Rule | Why |
|---|---|
| snake_case, stable names (checkout_started) | The name is the key to everything: filters, conversions, Deliveries. Renaming later breaks history. |
| Properties with primitive values only (text, number, boolean) | Nested objects arrive but never become filterable columns — useless for segmenting. |
| Event = a fact that happened; super property = context that lasts | "checkout_started" is an event; "plan: pro" is context that sticks to what follows. |
| Consistent value spelling (pro, not Pro/PRO) | Filters and conversions compare text — three spellings become three segments. |
| Email and phone ONLY through identify, never as event properties | Identity has its own path, with validation and merging; a loose property is dead data. |
| Fire on the SUCCESS of the action, not on the click | A click that failed is not a conversion — the success handler is where the event belongs. |
Before instrumenting everything: pick half a dozen events that answer real questions (what predicts activation? what precedes purchase?) and name them in a vocabulary the whole team understands. An event nobody queries is pure cost.
4. Identify the logged-in user
In a SaaS or members area you already know who the person is — tell the pixel. Identification links all previous anonymous browsing to the account, and it works across devices: the same email on two machines becomes a single person on the timeline.
window._cl = window._cl || [];
window._cl.push(function (pixel) {
var email = 'user@company.com'; // email from the logged-in session
if (pixel.getEmail && pixel.getEmail() === email) return; // already identified
pixel.eventManager.trackLead({ email: email });
});Tracking your own logged-in app? Turn off automatic form capture in the source settings: a team-invite form carries SOMEONE ELSE’s email, and auto-capture would overwrite the session identity with it. We run the pixel on our own app exactly this way.
5. Watch the data arrive
- 01Open the Pixel source in the app: the event counter and the last received event show at the top.
- 02Visit your site and browse 2–3 pages — the pageView lands within seconds.
- 03Open Leads: the visit becomes a lead (anonymous until it has an email; identified after identify or a form).
- 04Open the lead’s timeline: every pageView, scroll and custom event appears in order.
From here, every event is available in Queries (SQL), in analysis artifacts, in conversions and in Deliveries to Meta, Google and the other destinations — without instrumenting anything twice.