vercel__next.js/examples/with-google-tag-manager

Example app using Google Tag Manager

This example shows how to include Google Tag Manager in a Next.js application using @next/third-parties. The GTM container is instantiated in layout.tsx and the sendGTMEvent function is fired in the EventButton Client Component.

Deploy your own

How to use

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example with-google-tag-manager with-google-tag-manager-app

yarn create next-app --example with-google-tag-manager with-google-tag-manager-app

pnpm create next-app --example with-google-tag-manager with-google-tag-manager-app

Next, copy the .env.local.example file in this directory to .env.local (which will be ignored by Git):

cp .env.local.example .env.local

Set the NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID variable in .env.local to match your Google Tag Manager ID.

Deploy it to the cloud with Vercel (Documentation).