How to Install GTM on Next.js and React Apps

For Next.js (App Router), use the @next/third-parties library: import GoogleTagManager from '@next/third-parties/google' and add <GoogleTagManager gtmId='GTM-XXXXXXX' /> to your root layout. For React SPAs, use a package like react-gtm-module or add the GTM snippets to your index.html. Critical for

Setup & Fundamentalsgtm nextjs react

TL;DR

For Next.js (App Router), use the @next/third-parties library: import GoogleTagManager from '@next/third-parties/google' and add to your root layout. For React SPAs, use a package like react-gtm-module or add the GTM snippets to your index.html. Critical for SPAs: standard GTM page view triggers do not fire on client-side navigation. Use History Change triggers in GTM or push custom events to the data layer on route changes to track page views correctly across your application.

Overview

Related Guides

See our complete guide library for detailed coverage of account setup, tracking implementation, campaign creation, audience building, creative best practices, and optimisation strategies across all platforms.

Questions & answers

How long does setup take?

Most configurations take 10-30 minutes. Full campaign setup and ongoing optimisation is a continuous process.

What budget should I start with?

Start with enough to generate at least 50 conversions per week for the platform's algorithm to learn effectively. This varies by industry and CPA.

When should I expect results?

Allow 2-4 weeks for the initial learning phase. Meaningful performance trends typically emerge after 30 days of consistent spending.