Back to Next Js

README

examples/with-google-tag-manager/README.md

16.2.51.6 KB
Original Source

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:

bash
npx create-next-app --example with-google-tag-manager with-google-tag-manager-app
bash
yarn create next-app --example with-google-tag-manager with-google-tag-manager-app
bash
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):

bash
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).