Set Up Google Analytics & Cookies with an AI Assistant (GTM, GA4, Consent Mode v2)

Lead

Hi! I kicked off 2025 determined to become a webmaster. This site is my lab and control room. Like any self-respecting webmaster, I eventually had to wire up Google analytics — and like any internet researcher, I’m sharing what worked. Below you’ll find a prompt for an AI assistant (I used Cursor), what to click in Google’s UIs, and a connection algorithm you can follow.

---

1) Prompt for the AI assistant

I need full analytics + cookie consent for an Astro SSR site with domain-based localization (oldasweb.com/ru/nl).

Requirements:

1. GDPR/CCPA-compliant cookie banner with i18n (EN/RU/NL)
2. Google Tag Manager integration
3. Google Analytics 4 via GTM
4. Consent Mode v2 with correct defaults
5. CSP compatibility via nonce
6. A11y: focus trap, ESC, role="dialog"
7. SSR-safe implementation
8. localStorage to persist choices

Architecture:

• Astro SSR with middleware.ts
• Domain localization
• SuperLayout.astro as the base layout
• Types in env.d.ts

Steps:

1. Set up CSP and nonce
2. Build CookieBanner component (full functionality)
3. Inject GTM in SuperLayout
4. Configure Consent Mode v2 (default denied)
5. Add TypeScript types
6. Test & verify

Important: default consent is denied, all scripts use a nonce, code must be SSR-safe.

---

2) Step-by-step in Google (no AdSense)

2.1 Google Tag Manager (GTM)

Create a container

• Go to tagmanager.google.com
• Create container:
  • Name: OldasWeb Production
  • Type: Web
  • Get the Container ID like GTM-XXXXXXX

Enable default Consent Mode

• Workspace → Tags → New
• Tag Configuration → Consent Mode
• Default Consent State:
  • ad_storage: denied
  • ad_user_data: denied
  • ad_personalization: denied
  • analytics_storage: denied
  • wait_for_update: 500
• Triggering: All Pages
• Tag Name: Consent Mode – Default

Trigger for consent updates

• Triggers → New
• Trigger Configuration → Custom Event
• Event Name: consent_update
• Fire on All Custom Events
• Trigger Name: Consent Update Event

Note: your banner must push a consent_update event to the dataLayer when the user chooses.

---

2.2 Google Analytics (GA4)

Create a property

• Go to analytics.google.com → Admin → Create Property
• Fill in:
  • Property Name: OldasWeb
  • Reporting Time Zone
  • Currency: USD
• Get your Measurement ID like G-XXXXXXXXXX

Add GA4 in GTM

• Tags → New
• Tag Configuration → Google Analytics: GA4 Configuration
• Paste the Measurement ID
• In Consent Settings, ensure the tag respects consent state (new containers do by default).
• Triggering:
  • All Pages (initialization)
  • + Consent Update Event (so GA4 re-initializes after the user decision)
• Tag Name: GA4 – Configuration

(Optional) Extra events

• Scroll Depth, Outbound Links, Form Submissions — add via separate tags/templates. Bind them to the same triggers, so they only fire after analytics_storage consent.

---

2.3 Publish & verify

Publish in GTM

• Submit → Publish
• Version Name: Initial Setup – Consent + GA4
• Version Description: Default Consent denied; GA4 via All Pages + consent_update

Verify on site

• Open the site in Incognito.
• Make sure the banner appears.
• Test:
  • Accept all — GA4 tags fire.
  • Reject — GA4 avoids cookies; no personalized events.
  • Preferences — partial choices (e.g., analytics only).
• Return later: the choice should persist; no banner noise.

---

3) The short algorithm

1. Security first: set CSP + nonce, allow only what you need.
2. Then consent banner: default everything off until the user chooses.
3. Wire GTM: manage all tags inside GTM.
4. Add GA4 via GTM and bind to consent_update.
5. Test accept / reject / partial + repeat visit.

Result: compliant, transparent, and controllable.