GA4 のトリセツ

目次 › 第 9 部 Google タグ マネージャーで計測を拡張する

9.5 応用的な計測

スクロール・要素の表示・動画など、より細かい行動を計測します。
実践書籍換算 約 10 ページ

この章で学ぶこと

  • 要素の表示トリガーで、特定の部分が見られたかを計測する方法
  • スクロール距離トリガーで、記事の読了率を細かく計測する方法
  • YouTube 動画トリガーで、埋め込み動画の視聴を計測する方法
  • タイマー トリガーで、一定時間の滞在を計測する方法

要素の表示トリガー

要素の表示 トリガーは、ページの中の 特定の要素が画面に表示された ときに発火します。

使いどころ

計測したいこと対象の要素の例
ページの下のほうにある CTA が見られたか記事の末尾の資料請求のバナー
料金表が見られたか料金表の <section>
フォームの送信完了メッセージが表示されたか「送信が完了しました」の <div>
広告やおすすめの枠が見られたかおすすめ記事の枠

設定の例

名前：Visibility - 料金表
トリガーの種類：要素の表示
選択方法：CSS セレクタ
要素セレクタ：#pricing-table
このトリガーを起動するタイミング：ページごとに 1 度
視認できる割合の下限：50%
画面上での最小表示時間：1000 ミリ秒（任意）
DOM の変化をモニタリング：オフ（後から表示される要素ならオン）
設定内容
選択方法要素の ID か CSS セレクタで、対象を指定する
起動するタイミング「ページごとに 1 度」「要素ごとに 1 度」「要素が画面に表示されるたび」から選ぶ
視認できる割合の下限要素の何 % が画面に入ったら表示とみなすか
画面上での最小表示時間何ミリ秒以上表示されたら発火するか（一瞬通り過ぎただけを除外する）
DOM の変化をモニタリングページの読み込み後に JavaScript で追加される要素も対象にする

ポイント 「DOM の変化をモニタリング」をオンにすると、ページの読み込み後に表示される要素（フォームの送信完了メッセージなど）も検知できます。ただし、ページの動作が重くなることがあるので、必要なときだけオンにしましょう。

イベントの例

イベント名：view_pricing
パラメータ：section_name = pricing_table

組み込み変数の「Percent Visible」（表示された割合）や「On-Screen Duration」（表示された時間）も、パラメータとして送れます。

スクロール深度

GA4 の拡張計測機能の スクロール（scroll）は、ページの 90% までスクロールされたときにだけ記録されます。25%、50%、75% など、もっと細かく知りたい場合は、GTM の スクロール距離 のトリガーを使います。

設定の例

名前：Scroll - 25/50/75/90
トリガーの種類：スクロール距離
縦方向スクロール距離：オン
割合：25,50,75,90
このトリガーの発生場所：一部のページ
条件：Page Path   先頭が一致   /blog/

タグの設定

名前：GA4 - Event - scroll_depth
タグの種類：Google アナリティクス：GA4 イベント
イベント名：scroll_depth
イベント パラメータ：
    percent_scrolled = {{Scroll Depth Threshold}}
トリガー：Scroll - 25/50/75/90

組み込み変数の「スクロール」（Scroll Depth Threshold など）を有効にしておく必要があります。

拡張計測機能のスクロールとの関係

方法イベント名記録されるタイミング
拡張計測機能scroll90% のみ
GTM で独自に計測独自の名前（例：scroll_depth）設定した割合ごと

注意 GTM で独自に計測する場合も、イベント名を scroll にすると、拡張計測機能の scroll と混ざってしまいます。独自の名前を付けるか、拡張計測機能のスクロールをオフにしてから、GTM で scroll を計測しましょう。

読了率を分析する

scroll_depth を記事ページで計測すると、探索のファネル（第 6 部）などで、記事ごとの 読了率 を分析できます。

例）/blog/ga4-setup/ の閲覧者 1,000 人
25% まで読んだ：820 人（82%）
50% まで読んだ：610 人（61%）
75% まで読んだ：430 人（43%）
90% まで読んだ：350 人（35%）

（数値は例）

途中で大きく減っている場所があれば、その部分の内容や構成を見直すきっかけになります。

YouTube 動画

サイトに埋め込んだ YouTube の動画 の視聴は、GA4 の拡張計測機能の「動画エンゲージメント」で計測できます（video_start、video_progress、video_complete）。GTM の YouTube 動画 トリガーを使うと、より細かい設定ができます。

設定の例

名前：YouTube - 動画の視聴
トリガーの種類：YouTube 動画
キャプチャ：開始、完了、一時停止・シーク・バッファリング、進捗状況
進捗状況：割合 10,25,50,75
すべての YouTube 動画に JavaScript API のサポートを追加する：オン

使える組み込み変数

変数内容
Video Provider動画の提供元（youtube）
Video Status動画の状態（start、progress、complete、pause など）
Video URL動画の URL
Video Title動画のタイトル
Video Duration動画の長さ（秒）
Video Current Time現在の再生位置（秒）
Video Percent再生の割合（%）
Video Visible動画が画面に表示されているか

注意点

注意点内容
拡張計測機能との二重計測拡張計測機能の動画エンゲージメントと、GTM の YouTube のタグの両方が有効だと、同じ視聴が二重に記録される。どちらか一方にする
対象は YouTube だけVimeo やサイトに直接置いた動画（<video> タグ）は、このトリガーでは計測できない。カスタム HTML やデータレイヤーで計測する
動画の読み込み方ページの読み込み後に動画を表示する場合や、動画のプレイヤーの設定によっては、計測できないことがある。プレビュー モードで必ず確認する

タイマー トリガー

タイマー トリガーは、ページを開いてから 一定の時間が経過するごと に発火します。

設定の例

名前：Timer - 60 秒滞在
トリガーの種類：タイマー
イベント名：gtm.timer
間隔：60000（ミリ秒）
制限：1（1 回だけ発火）
このトリガーを有効にする条件：Page Path 先頭が一致 /blog/
設定内容
間隔何ミリ秒ごとに発火するか（60000 = 60 秒）
制限最大で何回発火するか（空欄なら、ページを閉じるまで発火し続ける）
有効にする条件どのページでタイマーを動かすか

使いどころ

  • 記事のページで、60 秒以上滞在したユーザーを「よく読んだ人」として記録する
  • 料金ページで、30 秒以上見たユーザーを、検討度の高いユーザーとしてオーディエンスに使う

注意 GA4 では、エンゲージメント時間（ページが前面に表示されていた時間）が自動的に計測されています（第 4 部）。タイマー トリガーは、ページが 背面にあっても 時間を数えてしまうことがあるため、「本当に読まれた時間」を測る目的なら、GA4 のエンゲージメント時間や、スクロールの計測と組み合わせて判断しましょう。

よくある質問

Q. 要素の表示トリガーが発火しません。

A. 次の点を確認しましょう。

確認すること内容
セレクタCSS セレクタや ID が、実際の要素と一致しているか（ブラウザの開発者ツールで、要素を確認する）
後から表示される要素ページの読み込み後に JavaScript で表示される要素なら、「DOM の変化をモニタリング」をオンにする
表示の割合と時間視認できる割合の下限や、最小表示時間の設定が厳しすぎないか
起動するタイミング「ページごとに 1 度」にしている場合、2 回目以降は発火しない

Q. スクロールの計測で、短いページでは 25〜90% のイベントが一度に発火します。

A. ページが短く、画面の高さに収まってしまう場合、ページを開いた時点で、すべての割合に到達したとみなされることがあります。短いページを分析の対象から外すか、トリガーの条件で、記事のページなど一定の長さがあるページに限定しましょう。

Q. YouTube の動画の計測が、うまく動きません。

A. 埋め込みのコードに、YouTube の JavaScript API を使うための設定が必要な場合があります。トリガーの「すべての YouTube 動画に JavaScript API のサポートを追加する」をオンにしても動かない場合は、動画の埋め込みの方法（プラグインやテーマの仕組み）を確認しましょう。また、拡張計測機能の動画エンゲージメントがすでに計測していないかも確認します。

Q. 新しいイベントを追加しすぎると、問題はありますか。

A. GA4 には、イベント名の種類の数や、カスタム ディメンションの数に上限があります（第 3 部）。また、イベントが多すぎると、レポートが見にくくなり、分析に使われないイベントが増えます。「このイベントで、何を判断するか」を決めてから追加しましょう。

実践ワーク

自社の記事のページ（またはサービスの紹介ページ）で、次の 2 つの計測を設計してみましょう。

計測トリガーの種類条件イベント名パラメータ
記事の読了スクロール距離25, 50, 75, 90%、記事のページのみscroll_depthpercent_scrolled
記事の末尾の CTA の表示要素の表示CTA の要素、50% 以上、1 秒以上view_ctacta_name

設計したら、GTM のプレビュー モードで動作を確認し、公開しましょう。1 か月後、「CTA が表示された人のうち、クリックした人の割合」と、「記事の 75% まで読んだ人の割合」を比べると、CTA の置き場所が適切かどうかを判断する材料になります。

まとめ

  • 要素の表示トリガーで、料金表やページ下部の CTA など、特定の部分が見られたかを計測できる
  • スクロール距離トリガーで、25%・50%・75% など細かい読了率を計測できる。拡張計測機能の scroll と名前を分ける
  • YouTube 動画トリガーで、埋め込み動画の開始・進捗・完了を計測できる。拡張計測機能との二重計測に注意する
  • タイマー トリガーで一定時間の滞在を計測できるが、背面のタブでも時間が進む点に注意する

次の章では、チームで GTM を安全に使い続けるための、命名規則や権限、公開前のチェックなどの運用ルールを学びます。

Ko-fi で制作者を支援する