> ## Documentation Index > Fetch the complete documentation index at: https://docs.verbose.cx/llms.txt > Use this file to discover all available pages before exploring further. # Web pixel > Install the pixel, track events, and react to on-site behavior with a flow. The Verbose pixel is a small script you add to your website. It streams the behavior you choose — page views, a checkout, a form submission, anything you name — back to your workspace, where a **flow** can react in seconds (send a text, place a call, tag the contact). It is dependency-free, loads asynchronously, and never blocks your page. It only captures what you explicitly tell it to: it does **not** read form values, URL query strings, or scrape the page. ## Install Each workspace has one **public** pixel key (it identifies your workspace — it is not a secret, and it is safe to ship in page source). Ask your Verbose contact for your key and the pixel URL for your account; both look like the example below. Paste this into your site's `` (or add it as a Custom HTML tag in Google Tag Manager). Replace the key with your own. ```html theme={null} ``` The pixel sends an automatic `page_view` on every load. Nothing else is tracked until you ask for it. So other sites can't send events as you, your workspace lists the origins the pixel will accept. Give your Verbose contact the exact origins you'll install on (e.g. `https://www.example.com`). Until an allowlist is set, all origins are accepted — fine for testing, not for production. ## Track an event Call `verbose('track', name, props)` anywhere in your site code. The **name** is yours to choose — pick something readable and stable (`checkout_started`, `quote_requested`, `cart_abandon`). The moment an event first arrives, its name appears in your workspace's flow-trigger picker; you don't register it anywhere first. ```js theme={null} // A simple event verbose('track', 'quote_requested'); // With properties — use these to condition on later verbose('track', 'checkout_started', { plan: 'gold', value: 149 }); ``` **Property rules.** Props must be simple scalar values — strings, numbers, booleans. Nested objects and arrays are dropped. Keep values short and never put personal or sensitive data (names, emails, health details, card numbers) in a prop. The collector strips anything that violates this, but the right place to enforce it is your own `track` calls. ### Common patterns ```html theme={null} ``` The auto page view fires once on load. For client-side navigation, send one yourself after each route change: ```js theme={null} router.afterEach(() => verbose('pageview', { title: document.title })); ``` Create a Custom HTML tag that calls `verbose('track', …)`, and fire it on whatever GTM trigger you like (a click, a form submit, a page path). This lets non-developers add events without touching site code. ## Tie events to a contact Events start **anonymous** — attached to a first-party visitor id the pixel stores in the browser. They connect to a contact in one of three ways: When someone clicks a tracked link in one of your texts, they land with a `?vcx=` parameter. The pixel remembers it for the session, so every event on that visit is tied to the contact automatically. If you know who the visitor is (they logged in, submitted a form you handle), tell the pixel: ```js theme={null} verbose('identify', { phone: '+15551234567' }); ``` This matches the visitor to the contact with that phone number in your workspace. Once a visitor is connected, their **earlier anonymous events from that browser are back-filled** to the contact — so "viewed pricing twice before they ever texted" is preserved. A flow only fires for a **known** contact. Anonymous events are still recorded and will attach retroactively once the visitor is identified — but the trigger runs at the moment the contact is known. ## React to an event with a flow In the flow editor, set the trigger's **Start when…** to *A website event fires (pixel)*. Pick the event name from the list (it's populated from the events your site has actually sent), or leave it blank to fire on **any** web event. Add the SMS, voice, wait, or tagging steps that should happen. Activate the flow. Now a matching event from a known contact enrolls them immediately. For example: a `cart_abandon` event triggers a flow that waits 20 minutes, then texts *"Still thinking it over? Your cart's saved — reply YES for a hand."* ## Consent For consent-sensitive sites, hold all tracking until the visitor agrees: ```html theme={null} ``` Nothing is sent — not even the page view — until you call: ```js theme={null} verbose('consent'); // e.g. from your cookie-banner "Accept" handler ``` ## Reference | Call | What it does | | -------------------------------- | --------------------------------------------------------------- | | `verbose('track', name, props?)` | Record a named event with optional scalar properties. | | `verbose('identify', { phone })` | Connect the current visitor to a contact by phone. | | `verbose('pageview', props?)` | Record a page view (use after SPA route changes). | | `verbose('consent')` | Release tracking when installed with `data-consent="deferred"`. | | Script attribute | Purpose | | ------------------------- | ------------------------------------------------ | | `data-key` | **Required.** Your workspace's public pixel key. | | `data-consent="deferred"` | Hold all tracking until `verbose('consent')`. | ## Troubleshooting Check, in order: the script's `data-key` matches your workspace; the site's origin is on your allowlist (or the allowlist is empty); and, if you used `data-consent="deferred"`, that `verbose('consent')` has run. The contact must be **known** — confirm the visitor arrived via a `?vcx=` link or that you've called `verbose('identify', …)`. Confirm the flow is **active** and its trigger event name matches (or is blank).