GatsbyJSにGoogleアナリティクスを導入する方法

この記事では

  • GatsbyJSにGoogleアナリティクスを導入する方法

について紹介します。

とても簡単に導入できるので、GatsbyJSをお使いの方はおすすめです。

プラグインのインストール

まずは、GatsbyJSのプラグインである gatsby-plugin-google-analyticsをインストールしていきます。

以下のコマンドでインストールします。

$ yarn add gatsby-plugin-google-analytics

または、以下のコマンドでインストールします。

$ npm install --save gatsby-plugin-google-analytics

gatsby-plugin-google-analytics

トラッキングIDを追加

次に gatsby-config.jsにプラグインの設定とGoogleアナリティクスのトラッキングIDを追加していきます。

gatsby-config.jsに以下のコードを追加します。

trackingIdの部分にご自身のGoogleアナリティクスのトラッキングIDを入れます。

gatsby-config.js
plugins: [
    {
      resolve: `gatsby-plugin-google-analytics`,
      options: {
        trackingId: `UA-XXXXXXXXXX-X`,
        head: true,
      },
    },
 ],

また、optionsではGoogleアナリティクスの様々な設定をすることができます。

optionsの詳細はGatsbyJSプラグインサイトを見てみてください!

gatsby-plugin-google-analytics

おわりに

今回はGatsbyJSにGoogleアナリティクスを導入する方法についてご紹介しました。

かなり簡単にGoogleアナリティクスを導入することができるので、GatsbyJSでサイトを作成した方はぜひ入れてみてください!

私もGoogleアナリティクスでサイトの分析・解析していこうと思います。