Script tag

Add the tag before </head>:

<script
  src="https://api.pixelfox.app/pixelfox.min.js"
  data-pixelfox-key="pfx_live_YOUR_KEY"
  data-pixelfox-host="https://api.pixelfox.app"
  defer
></script>

The tag initializes automatically on DOMContentLoaded. It is ~9 kB gzipped, loads defer (never blocks rendering), and fails silent - a missing key logs one console warning and does nothing else.

Attributes

Manual initialization

For SPAs or custom setups, suppress auto-init and configure in code:

<script src="https://api.pixelfox.app/pixelfox.min.js" data-no-init="true" defer></script>
<script>
  window.addEventListener("DOMContentLoaded", () => {
    pixelfox.init({
      apiKey: "pfx_live_YOUR_KEY",
      host: "https://api.pixelfox.app",
      productPathPrefixes: ["/shop", "/collections"],
    });
  });
</script>

See the SDK API reference for every option.

Where the script is served from

By default pixelfox.min.js and every event request come from the PixelFox ingest host. Point a subdomain of your own at PixelFox and both move onto your domain, which keeps them off ad-blocker lists and lets attribution cookies live two years: see Custom ingest endpoint. Any CDN can also sit in front of the ingest host; keep data-pixelfox-host on the ingest or first-party host so events still reach the API.

Gotchas

• Single-page apps - route changes are tracked automatically (the SDK wraps history.pushState); you do not need to call track("$pageview") manually.
• Content Security Policy - allow script-src for the CDN host and connect-src for your ingest host. If you use vendor pixels, their usual CSP entries also apply.
• Ad blockers - some blockers stop any analytics script. Server-side fan-out still works for events sent from your backend (see the WooCommerce/Laravel purchase helpers).