PostHog

PostHog is an open-source product analytics platform that helps you understand user behavior, track events, and analyze product usage. Unlike traditional analytics tools, PostHog supports both cookieless and cookie-based tracking. This means you can sync c15t with PostHog and, when your PostHog project is configured for cookieless tracking, continue collecting privacy-preserving analytics after a user rejects measurement consent.

c15t exposes two integration patterns for PostHog. Pick the one that matches how you already load the SDK:

• PostHog SDK — your app loads posthog-js itself; c15t only synchronizes consent. Recommended for most React apps.
• PostHog Script — c15t loads PostHog's array bootstrap as a managed Script.

Integrate with c15t

SDK pattern

This is the recommended approach if you're using the PostHog JS SDK; it's commonly used in React projects.

posthog.init("phc_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", {
  api_host: "https://eu.i.posthog.com",
  defaults: "2026-01-30",
  cookieless_mode: 'on_reject'
})

posthog.opt_out_capturing() // Avoids cookie-based capture until c15t syncs consent

import { getOrCreateConsentRuntime } from 'c15t';
import posthog from 'posthog-js';

function syncPostHogMeasurementConsent(hasMeasurementConsent: boolean) {
  if (hasMeasurementConsent) {
    posthog.opt_in_capturing();
  } else {
    posthog.opt_out_capturing();
  }
}

const runtime = getOrCreateConsentRuntime({
  mode: 'hosted',
  callbacks: {
    onBannerFetched() {
      syncPostHogMeasurementConsent(
        runtime.consentStore.getState().has('measurement')
      );
    },
  },
});

runtime.consentStore
  .getState()
  .subscribeToConsentChanges(({ allowedCategories }) => {
    syncPostHogMeasurementConsent(
      allowedCategories.includes('measurement')
    );
  });

Script helper pattern

If you want to load PostHog via a script tag, it's recommended to use this approach.

const initOptions = {
  api_host: 'https://eu.i.posthog.com',
  ui_host: 'https://eu.posthog.com',
  defaults: '2026-01-30',
  cookieless_mode: 'on_reject',
};

import { type ReactNode } from 'react';
import { ConsentManagerProvider } from '@c15t/react';
import { posthog } from '@c15t/scripts/posthog';

const scripts = [
  posthog({
    id: 'phc_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
    region: 'eu',
    loadMode: 'after-consent',
  }),
];

export function ConsentProvider({ children }: { children: ReactNode }) {
  return (
    <ConsentManagerProvider
      options={{
        mode: 'hosted',
        backendURL: 'https://your-instance.c15t.dev',
        scripts,
      }}
    >
      {children}
    </ConsentManagerProvider>
  );
}

No PostHog request before consent

If your policy requires PostHog to be completely absent until the user grants measurement consent, use loadMode: 'after-consent':

import { posthog } from '@c15t/scripts/posthog';

const scripts = [
  posthog({
    id: 'phc_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
    region: 'eu',
    loadMode: 'after-consent',
  }),
];

With this mode, c15t does not inject the PostHog script until measurement consent is granted. PostHog cannot record cookieless rejected-consent events because the SDK has not loaded.

For PostHog Cloud US, switch the region:

posthog({
  id: 'phc_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
  region: 'us',
});

How c15t loads it

• Category: measurement (Analytics)
• SDK pattern: your app loads posthog-js; c15t synchronizes measurement consent with PostHog opt-in and opt-out APIs.
• Script helper pattern: by default, c15t loads PostHog on page start with alwaysLoad, then switches PostHog between cookie-based and cookieless capture as consent changes. Set loadMode: 'after-consent' to block the script request until measurement consent is granted.

Tracking events in your app

The behavior depends on which pattern you chose:

• SDK Implementation — your app loaded posthog-js itself, so posthog.capture(...) is available once your SDK setup has run. c15t calls opt_in_capturing() / opt_out_capturing() for you. Pending events before c15t syncs consent may be dropped; after denial, PostHog captures cookieless events.
• Script Implementation with loadMode: 'always' — window.posthog is defined early. c15t calls opt_in_capturing() / opt_out_capturing() based on consent. Pending events before the PostHog bootstrap finishes may be dropped; after denial, PostHog captures cookieless events when your PostHog project supports cookieless mode.
• Script Implementation with loadMode: 'after-consent' — PostHog is unavailable until measurement consent is granted. Guard posthog.capture(...) calls or call them only after consent.

posthog.capture('signup');

You do not need to guard these calls with useConsentManager().has('measurement') when cookieless measurement after rejection is acceptable. Add your own guard if denied consent should mean no PostHog event capture at all.

Consent and privacy

PostHog's GDPR guidance recommends using PostHog Cloud EU for robust GDPR compliance, configuring consent clearly, and limiting what personal data is collected. Cookieless mode helps avoid browser persistence when measurement consent is rejected, but it does not replace your own legal basis, consent language, data minimization, IP capture settings, or right-to-be-forgotten process.

Types

PosthogConsentOptions

Script