Google Analytics 4 for Next.js.
This package is hosted on npm
.
npm install @bradgarropy/next-google-analytics
This component integrates Google Analytics 4 into your Next.js website. It downloads and initializes the gtag
script, and no further setup is required. In order to work, this component must be placed in the pages/_app.js
file.
// pages/_app.js
import GoogleAnalytics from "@bradgarropy/next-google-analytics"
const App = ({Component, pageProps}) => {
return (
<>
<GoogleAnalytics measurementId="G-XXXXXXXXXX" />
<Component {...pageProps} />
</>
)
}
To ensure that Google Analytics is working, you can check a few things.
- A network request was made to
https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX
. window.dataLayer
exists and includes your Measurement ID.- When you navigate your site, items are added to the
window.dataLayer
array.
Name | Required | Default | Example | Description |
---|---|---|---|---|
measurementId |
true |
"G-XXXXXXXXXX" |
Google Analytics Measurement ID. |
The example below shows how to use the component.
<GoogleAnalytics measurementId="G-XXXXXXXXXX" />
π report bugs by filing issues
π’ provide feedback with issues or on twitter
ππΌββοΈ use my ama or twitter to ask any other questions
Brad Garropy π» π |