# Click Tracking > Track affiliate visits with the Affitor tracker SDK or script tag Click tracking is the first step in every Affitor integration. It detects affiliate visits, creates the click/customer relationship, and stores the browser identifier used by later signup and sale attribution. --- ## What It Does When someone lands on your site through an affiliate link such as: ```text https://yoursite.com?aff=PARTNER123 ``` the tracker: 1. detects the `?aff=` parameter 2. sends click data to Affitor 3. creates or updates the tracked customer relationship 4. stores `affitor_click_id` in a first-party cookie 5. makes later signup and sale attribution possible That cookie value is later reused as: - `click_id` in API payloads - `affitor_click_id` in Stripe metadata --- ## Choose Your Installation Method | Method | Best for | Benefits | |--------|----------|----------| | **npm SDK** | React, Next.js, JS/TS apps | Promise-based loading, TypeScript support | | **Script tag** | Static HTML, CMS sites, no-build installs | Copy-paste setup, no build step required | --- ## npm SDK Install the tracker package: ```bash npm install @affitor/sdk ``` ### React / Next.js :::warning **Next.js 13+ App Router:** `layout.tsx` is a Server Component by default. `@affitor/sdk` uses browser APIs and cannot run in a Server Component. Create a client component that calls `init` and render it once in your layout. ::: ```tsx // app/providers.tsx — client component 'use client'; import { useEffect } from 'react'; import { init } from '@affitor/sdk'; export function AffitorInit() { useEffect(() => { init({ programId: YOUR_PROGRAM_ID }); }, []); return null; } // render once in app/layout.tsx ``` ### Any JS / TS app ```ts import { init } from '@affitor/sdk'; init({ programId: 'YOUR_PROGRAM_ID' }); ``` ### Astro Astro isn't React, so the React `` shown above doesn't apply. Add the tracker from a client ` ``` Prefer a no-build install? Drop the [Script Tag](#script-tag) into the same `` with Astro's `is:inline` directive, so Astro leaves the external script untouched: ```astro ``` Track referred signups the same way — call `signup()` from a client ` ``` ### Required attributes | Attribute | Required | Description | |-----------|----------|-------------| | `src` | Yes | tracker script URL | | `data-affitor-program-id` | Yes | your Affitor program ID | | `data-affitor-debug` | No | set to `true` while testing | --- ## How Affiliate Links Work Affitor looks for the `aff` query parameter on landing URLs, for example: ```text https://yoursite.com?aff=PARTNER123 https://yoursite.com/pricing?aff=PARTNER123 ``` When that parameter is present, the tracker records the click and creates the customer relationship used by signup and sale attribution. --- ## Verifying Installation ### Enable debug mode **SDK:** ```ts import { init } from '@affitor/sdk'; init({ programId: 'YOUR_PROGRAM_ID', debug: true }); ``` **Script tag:** ```html ``` ### What to verify Open your browser console and network tab, then confirm: - The tracker loads without errors - Cookies can be written and read - Affitor debug messages appear in the console - Click or test-click activity appears in the dashboard or test-event tooling :::caution Debug mode helps with test verification, but a real affiliate landing flow using a real `?aff=` value still creates real attribution data. Do not mix synthetic tests and production affiliate links. ::: --- ## Common Issues ### No click data appears Check: - The tracker script loaded successfully - The page was visited with a valid `?aff=` parameter - Your program ID is correct - CSP rules or browser extensions are not blocking the script ### Cookies are missing Check: - The site is served over HTTPS in production - Browser privacy tools are not blocking cookies - The affiliate landing page executed the tracker before the visitor continued ### Later signup/sale tracking fails This usually means one of the following: - Click tracking did not run before the signup or sale event - The browser session lost `affitor_click_id` between landing and conversion - Signup/payment identifiers do not consistently match your internal customer ID --- ## Next Steps Once click tracking is working, continue with: - [Lead Tracking](/brand/tracking/lead-tracking-signup/) - [Payment Tracking](/brand/tracking/payment-tracking-stripe/) - [Testing Integration](/brand/tracking/testing-integration/)