Hugo で生成しているブログをユニバーサルアナリティクスから Google Analytics 4 に移行する
2022-06-01Google Analytics のユニバーサルアナリティクス (UA) が 2023年 7月に廃止され、それ以降は Google Analytics 4 (GA4) を使う必要があります。まだ UA 廃止までの猶予はありますが、PV 等の各値を比較したくなったときに 1 年前のデータが無いと困るので、なるはやで移行しておく必要があります。今回は、とりあえずこのブログを UA から GA4 に移行してみます。
ユニバーサル アナリティクスのサポートは終了します - アナリティクス ヘルプ
やること
GA4 に切り替えていない状態で対象のプロパティの画面を開くと、ページ上部に下記のようなメッセージが表示されています。
ここの [開始] から GA4 のプロパティを設定していきます。
プロパティの設定ができたら、発行されたスクリプトをブログの <head> タグ内に配置します。
今回は、細かい設定はスキップして とりあえず GA4 のプロパティで PV だけでも計測できるようになることをゴールとします。
GA4 プロパティの設定
先ほどの [開始] を押すと下記のような画面に遷移します。
今回は新たに GA4 のプロパティを作成します。
新しい Google アナリティクス 4 プロパティを作成する
GA4 設定アシスタントの画面から 新しい Google アナリティクス 4 プロパティの作成 を開始すると、下記のようなウィザードが表示されます。
ここで [作成] を押すと、 GA4 設定アシスタントの画面に戻り、下記のような表示になる。
GA4 のプロパティが作成された。
GA4 プロパティの機能の確認と設定を行う
[GA4 プロパティを確認] を押すと GA4 の設定画面に遷移します。
正直、設定項目が多すぎてよくわからん。ので、欲を出さずに PV だけでも計測できるようになること を目指す。
データストリーム の項目を見ると、下記のようにまだデータが受信できていません。(それはそう)
ストリームの一覧から対象の行をクリックすると、下記のような詳細が表示されます。
タグの設定手順 にある通り、データストリームで各値を計測するにはいずれかの方法でページ上にタグを埋め込む必要があります。
今回は 新しいページ上のタグを追加する 、且つ GTM を使っていないため gtag.js を追加する方法で進めます。
埋め込むタグは下記のような形式です。
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXX');
</script>
これをこのブログの <head></head> 内に配置します。
GA4 のプロパティタグをブログに設置する
このブログは Hugo で生成しており、テーマには Simplog を使っています。
Simplog は UA のタグ埋め込みには対応しています (UA-XXXXXX を config.toml に追記するだけで OK) が、 GA4 の埋め込みには対応していません。ただ、 partials/additional-custom-head.html を作成すれば head 内にその内容が埋め込まれるようになっているので、 partials/additional-custom-head.html にプロパティタグを記述する方法で対応します。
simplog/head.html at c6940745f5b0751a408f3fc959f231b9ec624e5a · michimani/simplog
ゆくゆくは G-XXXXXXXXX のタグを config.toml に記述するだけでタグが埋め込まれるようにしたい。(してくれる方がいたら PR お待ちしています)
設置して様子を見る
GA4 のプロパティタグを設置したらしばらく様子を見て、先ほどのデータストリームを確認します。
他にやること
GA4 の設定を見る限りだと
- Google Search Console との統合
- Google AdSense との統合
あたりは設定が必要そうです。
comments powered by Disqus