How to Track a Checkout Funnel Step by Step

Checkout is where measurement stakes peak: every step has a real abandonment rate, every abandonment has a real euro value, and platitudes ('reduce friction!') substitute for data in most post-mortems. Four events make the funnel inspectable; the per-visitor timeline makes the abandonments explainable. Neither requires cookies.

The four-event spine

track('cart_added',       { sku, price, cart_value });
track('checkout_started', { cart_value, items });
track('payment_submitted',{ method: 'card' });
// 'order_completed' — server-side, from the order webhook,
// with visitor_id captured at checkout (see below)

The final event must be server-side: thank-you-page pixels die to redirects and closed tabs precisely when money moves. Stash window.webanalytics.getVisitorId() in a hidden checkout field or order metadata, and the webhook joins the purchase to the journey — the full e-commerce pattern has the payload.

Reading the leaks

1. cart → checkout (worst leak on most stores): shipping-cost surprise and forced account creation are the two killers; segment by device — mobile cart abandonment running 2× desktop usually indicts the checkout form, not the intent.
2. checkout → payment: form length and field failures. Watch failed-then-retried payment submissions: payment_submitted without order_completed and without a visible error is a silent gateway failure eating revenue.
3. payment → completed: 3-D Secure drop-offs and webhook gaps. If analytics shows fewer completions than your store admin, your tracking leaks; if more, your idempotency does (order_id dedupes).

The two cross-cutting segments

• Speed: per-visit load times on checkout pages, p75, mobile. Slow checkout steps have the highest conversion-per-millisecond stakes on your entire site.
• Source: first-touch attribution per completed order tells you which channels send buyers versus browsers — ad ROI computed on orders, not clicks.

When the aggregate is not enough

Funnel percentages say where; timelines say why. Filter journeys to checkout_started-without-completion and read ten: the pattern is usually embarrassingly concrete — the coupon field that triggers a JavaScript error, the address validator rejecting legitimate addresses, the 6-second payment redirect on mobile. One reading session, one sprint of fixes, and the funnel chart moves more than a quarter of optimization theory ever achieved.