Google Tag ManagerでGA4リアルタイムが0になる問題の完全解決手順
エンジニアはデジタルマーケティングにも精通しなければならない
目次
安達 奨(Susumu Adachi)
ITコンサルタント/Knowledge marketing合同会社 代表
IT業界で15年以上の経験を持ち、システム開発の上流工程から下流工程に至るまで幅広く精通。(企画、要件定義、設計、プログラミング、テスト)
現在ではシステム開発のみならず、ツール選定、ベンダー選定など、大手~中小企業向けのIT支援を多数手がける。
本サービスでは、特に事業会社時代から "システム開発会社の見積"
に疑問を感じており、これを是正すべきと考え監修を行っている。
Laravelサイトに Google Analytics 4(GA4) を導入するため、 Google Tag Manager(GTM)経由でGA4を設定 しました。
しかし、設定は正しく見えるのに次の問題が発生しました。
発生した問題
- GTMプレビューではタグが発火している
- GA4 DebugViewにはイベントが届いている
- しかし GA4リアルタイムが0
- 数時間待っても表示されない
- 別ブラウザ・スマホでも0
かなりハマりましたが、最終的に原因は複数ありました。
結論(今回の原因)
GA4リアルタイムが表示されなかった原因
- GoogleタグだけでGA4イベントタグを作っていなかった
- Consent Mode v2 が設定されていなかった
- Internal Traffic フィルタが有効だった
- Googleタグのテンプレートが古かった
- g/collect が送信されているか確認していなかった
この記事では、GA4が動かない時の完全な確認手順 をまとめます。
① GTMをLaravelに設置
まずLaravel側には GA4コードではなくGTMコードを設置 します。
通常は resources/views/layouts/app.blade.php の head と body に設置します。
head
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX';f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
body直後
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
Laravel側は基本これだけです。
② Googleタグを作成
次にGTMで Googleタグ を作成します。
Googleタグ設定
タグタイプ:Googleタグ / 測定ID:G-XXXXXXXX / トリガー:All Pages
ここまでで普通は page_view が送信されます。
しかし今回、ここで大きな罠がありました。
③ GA4イベントタグを作成しないと送信されない罠
今回ハマったポイント1です。
結論、Googleタグを作っただけではGA4にイベントが送信されませんでした。
そこで以下のタグを追加しました。
GA4イベントタグ
タグタイプ:Google Analytics: GA4イベント / イベント名:page_view / 設定タグ:Googleタグトリガー:All Pages
最終構成
Googleタグ+GA4イベントタグ(page_view)
このイベントタグを作成した瞬間、 GA4リアルタイムにユーザーが表示されるようになりました。
これはかなりの罠ポイントです。
重要
Googleタグだけでは送信されない場合があるGA4イベントタグを作る。
④ Consent Mode v2 の設定(dataLayerでの設定も重要)
GA4をGTMで利用する場合、2024年以降は Consent Mode v2 の設定がほぼ必須になっています。
GTM側で「同意の初期化タグ」を作成する方法もありますが、 Laravel側の <head> に dataLayer で consent default を入れておく方法がおすすめです。これがハマったポイント2です。
まず、この同意を入れていないと、次の状態になることがあります。(特に記載のないサイトもあったため、一応「なることがある」とします)
analytics_storage = denied
この状態だと
| DebugView | 表示される |
|---|---|
| リアルタイム | 表示されない |
| レポート | 出ない |
という状態になります。
Laravelの<head>にdataLayer consentを追加
Laravelのレイアウトファイル(例:layouts/app.blade.php)の Google Tag Managerより前に 次のコードを追加します。
headに追加するコード
<script>window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag('consent', 'default', { ad_storage: 'granted', analytics_storage: 'granted', ad_user_data: 'granted', ad_personalization: 'granted'});</script>
その後にGTMコードを読み込みます。
headの順番(重要)
<head><script>window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag('consent', 'default', { ad_storage: 'granted', analytics_storage: 'granted', ad_user_data: 'granted', ad_personalization: 'granted'});</script><!-- Google Tag Manager --><script>(function(w,d,s,l,i){...})</script><!-- End Google Tag Manager --></head>
順番が非常に重要です。
① dataLayer consent② GTM③ Googleタグ④ GA4イベントタグ
この順番になります。
なぜdataLayer consentをheadに入れるのか
理由は、GTMが読み込まれる時点で Consent状態がgrantedになっている必要がある ためです。
もしこれが無いと
analytics_storage = denied
の状態でGoogleタグが発火し、 GA4にデータが保存されない ことがあります。
これは DebugView には表示されるのに リアルタイムやレポートに出ない原因になります。
Consent Mode設定方法まとめ
Consent Modeの設定方法は2種類あります。
方法①(GTMで設定)
- 同意の初期化タグ
- Consent Initialization
- analytics_storage = granted
方法②(Laravel側で設定)
head に dataLayer consent を追加
実務的には
Laravel head dataLayer+GTM Consent Initialization
両方入れておくと安定します。
⑤ Internal Traffic フィルタ
これもリアルタイムが表示されない原因になります。
確認場所
GA4 → 管理 → データ設定 → データフィルタ
Internal Traffic が Active だと 自分のアクセスは表示されません。
テスト中は
InactiveまたはTesting
にしておきます。
⑥ DebugView の確認方法
次に DebugView を確認します。
DebugView確認手順
- GTMプレビュー
- サイトアクセス
- GA4 → DebugView
- page_view が来ているか確認
DebugViewに来ていれば
GTM → GA4 の送信は成功
しています。
しかしここで安心してはいけません。
DebugViewに来ていてもリアルタイムに出ないことがあります。
そこで次の確認が最重要になります。
⑦ Network → g/collect を確認(最強の確認方法)
これが 最も確実な確認方法 です。
手順
Chromeで
F12 → Network → collect で検索
以下のリクエストがあればGA4に送信されています。
https://www.google-analytics.com/g/collect
これが意味すること
| 状態 | 意味 |
|---|---|
| g/collect あり | GA4に送信成功 |
| g/collect なし | GA4に送信されていない |
つまり
DebugViewよりもg/collect の方が正確
g/collect が無い場合の原因
- Googleタグ未発火
- GA4イベントタグがない
- Consent denied
- 測定ID間違い
- Internal Traffic
- タグ未公開
- トリガー間違い
GA4が動かない時は DebugView より先に g/collect を確認するのが一番早いです。
これはかなり重要です。
リアルタイムに反映されるまで
GA4の反映時間の目安
| 表示 | 時間 |
|---|---|
| DebugView | 即時 |
| リアルタイム | 数秒〜1分 |
| レポート | 数時間〜24時間 |
リアルタイムは通常1分以内に表示されます。
GA4が動かない時のチェックリスト
最後にチェックリストです。
チェックリスト
□ GTMコードがLaravelに入っている
□ Googleタグがある
□ GA4イベントタグがある
□ Consent Initialization タグがある
□ analytics_storage = granted
□ Internal Traffic フィルタOFF
□ DebugViewにイベントが来ている
□ Networkに g/collect がある
□ 測定IDが正しい
□ タグ公開している
□ 別ブラウザで確認した
まとめ(最重要)
今回の重要なポイントから言えば、以下の手順を押さえておくことでスムーズに設定できるでしょう。
① Googleタグを作る
② GA4イベントタグを作る
③ Consent Mode設定
④ Internal Traffic確認
⑤ DebugView確認
⑥ Network → g/collect確認
特にこれが重要です。
GA4が動かない場合、多くの人はDebugViewを確認しますが、 実際には Chrome DevTools の Network タブで https://www.google-analytics.com/g/collect が送信されているかを確認するのが 最も確実で早い確認方法でした。
DebugViewに表示されていても、g/collectが送信されていなければ GA4にはデータは保存されません。
GA4が動かない時はまず g/collect が送信されているか確認 これが一番確実です。
GA4リアルタイムが0になる原因まとめ
最後にまとめ。
主な原因
- GA4イベントタグがない
- Consent Mode v2 未設定
- Internal Traffic フィルタ
- Googleタグテンプレートが古い
- 測定ID間違い
- タグ未公開
- g/collect が送信されていない
Laravel + GTM + GA4 の場合、 GA4イベントタグを作っていない のがかなりハマるポイントでした。