Install the Affonso tracking script on your website.
Affonso supports two delivery modes.
Hosted mode (default): add this script to your root layout so it loads on every page:
data-affonso="cmush8ygx001it0ddp5bd2rt5"
data-cookie_duration="30"
src="https://cdn.affonso.io/js/pixel.min.js"
Next.js — Use the Script component in your root layout (app/layout.tsx):
import Script from 'next/script'
Plain HTML — Add to the of every page:
First-party mode (optional, recommended if content blockers block third-party requests). You can choose any prefix on your domain. In this example we use /r:
In first-party mode, proxy these customer-domain paths:
- /r/pixel.js -> https://cdn.affonso.io/js/pixel.min.js
- /r/psl.min.js -> https://cdn.affonso.io/js/psl.min.js
- /r/track -> https://api.affonso.io/v1/track
- /r/signups -> https://api.affonso.io/v1/signups
Other frameworks:
Framework Where to add
React (Vite/CRA) index.html
Vue.js index.html or App.vue
Astro Layout.astro
WordPress Theme header or plugin
Webflow/Framer/Wix Custom code in site settings
Important:
Must load on all pages — use your root layout or shared template.
Use the appropriate loading strategy for your framework (defer for HTML, afterInteractive for Next.js).
Do not modify the data-affonso or data-cookie_duration values.
For more reliable tracking when ad blockers or privacy tools are present, use first-party mode with your own path prefix. A neutral prefix like `/r` is usually better than a vendor name.
If you proxy `/track` or `/signups`, preserve a trusted real client IP header such as `CF-Connecting-IP`, `True-Client-IP`, or `X-Real-IP`, otherwise country data can be wrong or missing.
Full guide: https://affonso.io/help/installation-guides/proxy-setup/pixel-tracking-proxy
Verify: After installing, open DevTools and confirm the requests succeed in your chosen delivery mode.
Skip to content