【手順】新機能！Googleアナリティクスでスクロール計測する方法（Googleタグマネージャ要素の表示）

これでスクロール計測が簡単になりました！

2017年中盤から、Googleタグマネージャに「スクロール計測」の新機能が登場しました。

「スクロール計測したい！」「ページがどこまで見られているか知りたい！」なんてお悩みの方は、Googleタグマネージャを使えば簡単に設定することができます。

以前までは無料ライブラリ「Scroll Depth」を使って計測をしていた方もこちらのほうがお勧めです。（10%ごとになど細かく設定できます。要素IDなどの指定も簡単です）

[aside type="normal"]以下、略語使用します。
GA＝Googleアナリティクス
GTM＝Googleタグマネージャ[/aside]

GA計測イメージ

最終的に、GAのイベントで、以下のキャプチャのように計測できます。
ページのPVに対して、どのエリアが何回表示されたか分析できます。
（特定の１ページでフィルタすることも可能です）

イベントカテゴリ：ID名
イベントアクション：data-label属性の文字列
イベントラベル：htmlタグ内の文字列

今回の計測対象のランディングページ

今回、テスト用に作成した計測のページは、各エリアのdivタグにid、classを設定しています。加えて、計測用のdata-labelという属性を付けました。

クラス名「area」
ID名「area」+連番
data-label属性「＜エリアの計測名＞」

設定したHTML

<div id="area1" class="area" data-label="メインビジュアル">エリア1です。</div>
<div id="area2" class="area" data-label="サービス説明">エリア2です。</div>
<div id="area3" class="area" data-label="商品の説明">エリア3です。</div>
<div id="area4" class="area" data-label="料金">エリア4です。</div>
<div id="area5" class="area" data-label="お問い合わせ">エリア5です。</div>

それでは、さっそくGTMの設定です。
GA、GTMの初期設定が済んでいることが、今回のスクロール計測の前提です。

前提条件

[ul]GTMでGAのタグを設置している
GTMのページビュー計測は設定済み
GAは設定して、計測確認済み[/ul]

GTM変数の作成

まず、変数を設定します。
「組み込み変数」から「Click Text」を設定します。
該当のタグで囲まれた文字列を取得できます（例：「エリア１です」）

表示された「data-label属性」を「自動イベント変数」で取得します。

表示された「ID名」をデータレイヤー変数の「gtm.elementId」で取得します。

GTMトリガーの作成

続いてタグ配信条件である「トリガー」を作成します。
「要素の表示」をトリガー種類として、選択し、次の画像の通り設定します。

選択方法にIDを指定して「area1, area2, area3, area4」など複数のエリアの指定も可能なようです。

GTMタグの作成

続いて、タグを作成します。
今回、イベントカテゴリ、アクション、ラベルは次のように設定します。

イベントカテゴリ：ID名に設定した文字列
イベントアクション：data-label属性に設定した文字列
イベントラベル：表示された要素内の文字列

タグに作成したトリガーをひも付けます。

GTMプレビュー

設定後、設定したタグの配信状況を実ページで確認します。
画面右上の「プレビュー」ボタンをクリックします。

実ページ（HTMLページ）をブラウザを開きます。
GTMプレビューモードにて、動作を確認します。
スクロールして、該当のエリアでタグが配信されているか確認します。

GA計測確認（リアルタイムレポート）

GTM配信されていることを確認したら、GAを開きます。

GAのリアルタイムレポートにて、イベントが計測されていることを確認します。
設定したイベントカテゴリ、イベントアクションが計測されていればOKです。

数時間後、レポートにも反映されていることも確認します。

次のカスタムレポートを作成し、状況を確認すると便利です。

[ul]種類：フラットテーブル
ディメンション：イベントカテゴリ
ディメンション：イベントアクション
ディメンション：イベントラベル
指標：合計イベント[/ul]
（ディメンションに「ページ」を追加して特定のページでフィルタすることもできます）

当日のデータは、数時間後に反映されます。確認するときは、設定期間に本日を含めることを忘れずに。

以上です。

ちょっと、Google アナリティクスの知識が足りないと感じた方は、まず書籍で学ぶことをお勧めします。

実践 Googleタグマネージャ入門 増補版 (デジタルプラスブックス)

posted with amazlet at 17.10.24

インプレス (2015-05-22)
売り上げランキング: 528

Amazon.co.jpで詳細を見る

「やりたいこと」からパッと引ける Google アナリティクス 分析・改善のすべてがわかる本

posted with amazlet at 17.10.24

小川 卓
ソーテック社
売り上げランキング: 18,802

Amazon.co.jpで詳細を見る

お手伝い：ココナラ

ココナラで実装の依頼の受けています。

Googleアナリティクス/Googleタグマネージャお手伝い | ココナラ
coconala.com/users/156256