GA4 + Google Ads (gtag.js)

Google Tag (gtag.js) is Google's unified tracking script for sending data to Google Analytics 4 (GA4), Google Ads, and Floodlight. It measures user behavior, tracks conversions, and powers Google's advertising ecosystem.

c15t initializes Google Tag with Consent Mode v2 defaults set to denied and automatically updates the consent state when users make choices. You don't need to configure Google Consent Mode yourself.

Choosing the right category:

• Use category: 'measurement' for analytics-only tracking (GA4 events)
• Use category: 'marketing' for advertising and conversion tracking (Google Ads)

Integrate with c15t

import { type ReactNode } from 'react';
import { ConsentManagerProvider } from '@c15t/react';
import { gtag } from '@c15t/scripts/google-tag';

const scripts = [
  gtag({
    id: 'G-XXXXXXXXXX',
    category: 'measurement', // or 'marketing'
  }),
];

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

How c15t loads it

• Category: configurable — measurement (default, Analytics) or marketing
• Loads when: alwaysLoad — runs on page start regardless of consent state, with Consent Mode v2 defaults set to denied
• On consent change: persists — c15t pushes a Consent Mode v2 update to gtag instead of removing the script

Tracking events in your app

gtag.js is alwaysLoad: true, so window.gtag is present from page start regardless of consent. Calls like gtag('event', 'sign_up') are safe at any time — c15t sets Consent Mode v2 defaults to denied before the user makes a choice, and Google's SDK suppresses transmission of events while the relevant consent is denied. When consent later changes, c15t emits a Consent Mode v2 update so events fire correctly going forward.

window.gtag?.('event', 'sign_up', { method: 'email' });

You do not need to wrap gtag(...) calls in a useConsentManager().has(...) check — Consent Mode handles the suppression for you.

Types

GtagOptions

Script