@bradgarropy/next-google-analytics
TypeScript icon, indicating that this package has built-in type declarations

1.0.2Β β€’Β PublicΒ β€’Β Published

πŸ“Š next google analytics

version downloads size github actions coverage typescript contributing contributors discord

Google Analytics 4 for Next.js.

πŸ“¦ Installation

This package is hosted on npm.

npm install @bradgarropy/next-google-analytics

πŸ₯‘ Usage

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.

  1. A network request was made to https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX.
  2. window.dataLayer exists and includes your Measurement ID.
  3. When you navigate your site, items are added to the window.dataLayer array.

πŸ“– API Reference

<GoogleAnalytics>

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" />

❔ Questions

πŸ› report bugs by filing issues
πŸ“’ provide feedback with issues or on twitter
πŸ™‹πŸΌβ€β™‚οΈ use my ama or twitter to ask any other questions

✨ contributors


Brad Garropy

πŸ’» πŸ“– ⚠️ πŸš‡

Package Sidebar

Install

npm i @bradgarropy/next-google-analytics

Weekly Downloads

360

Version

1.0.2

License

MIT

Unpacked Size

12.2 kB

Total Files

12

Last publish

Collaborators

  • bradgarropy