前回は、Googleタグマネージャの特徴・メリットから、ページビュー設定方法までをご紹介しました。

Googleタグマネージャでアナリティクスを管理しよう！メリット・ページビュー設定方法
Webサイトやアプリを運営してる方にとっては馴染みのある「Googleアナリティクス」。日々の目標を追ったり施策の分析で …

今回は、全てのクリックイベントを管理するタグ作成方法をご紹介します。今までの様にタグを手動で入れる必要が無いのでおすすめです。

Googleタグマネージャでイベント管理するメリット

前回の記事でも少し書きましたが、「取りたい数字が開発なしにすぐ取得できる」、「イベント管理が煩雑にならない」が大きなメリットです。

今までは、ソースコード上に直接以下のイベントを埋め込んでいました。

ga('send','event','[カテゴリー]','[アクション]','[ラベル]','[値]');

小規模でスピード感のあるサービスであれば、この運用でも構いません。ただし、規模が大きいサービスの場合、イベントを埋め込むまでに時間を要したり、どこでイベントが発生しているのか管理が煩雑になります。

これらをGoogleタグマネージャで行えば、エンジニアに依頼しなくても取りたい情報をすぐに取得できますし、どこで何のイベントが起きているか管理することができます。

イベントを設定してみよう

それではさっそくイベントの設定方法をご紹介します。今回は、全ての<a>リンクに対してイベントをカウントするタグを作成します。<Div>タグなど、アンカーリンク以外のイベント取得方法は別途ご紹介します。

1.変数の選択

まずイベントタグ設定で使用する変数を選択します。
「変数→組み込み変数→設定」を選択して下さい。組み込み変数一覧が表示されますので、ページ、ユーティリティ、クリックの必要な項目を選択します。今回必要な項目は以下の通りです。

  • Page URL
  • Event
  • Click URL

今後他の項目も使用する場合があるので、一通り選択して頂いても構いません。

 

2.タグの作成

前回同様タグを作成しましょう。「ワークスペース>タグ>新規」を押してください。
タグタイプは「ユニバーサルアナリティクス」、トラッキングタイプは「イベント」を選択して下さい。Googleアナリティクス設定では、前回作成した「UAアナリティクス」の変数を選択して下さい。

次にカテゴリ、アクション、ラベルの設定です。カテゴリはアクション、ラベルを包括する汎用的な名前付けをおすすめします。今回は「all_link」と言う名前で設定しました。
アクション、ラベルは変数を入れます。

3.アクション、ラベルの変数入力

アクションには「クリックしたリンクURL」、ラベルには「クリックが発生したページURL」を設定していきましょう。

まずはアクション横の＋ボタンを押して下さい。その中から、「Click URL」を選択しましょう。これは、クリックしたリンクの遷移先URLを取得、挿入してくれる変数です。選択するとアクションに「{{Click URL}}」と表示されます。このままでも良いですが、アクションしてどのページに行ったかよりわかりやすくするため、名前を「click_to_{{Click URL}}」に変更しましょう。

次にラベルの設定です。同じように＋ボタンを押して、今度は「Page URL」を選択して下さい。これはイベントが発生した時のページURLが変数として入ります。どのページでイベントが起きたか把握することができます。

全てを設定した画面がこちらになります。

4.トリガーの設定

次にどのタイミングでタグを実行するか、トリガーを設定しましょう。トリガーをクリックし「All Link Click」を選択して下さい。これは、全てのリンククリックをトリガーとして実行します。
これでリンクイベントを取るタグの設定は完了です。名前を付けて保存しましょう

非インタラクションヒットの設定について

非インタラクションヒットとは、「そのクリックを直帰率の対象にするかどうか」を設定する項目です。項目は以下の通りです。

  • 真：イベントを遷移として判断しないため、直帰率に影響しない。外部リンクは「直帰」と判断する
  • 偽：イベントを遷移として判断するため直帰率に影響する。外部リンクは「直帰」と判断しない

少し難しいので、例を用意しました。
例えば、ページ内に外部リンクを設置していた場合。真にしていると外部リンクは別コンテンツ扱いとなるため、「ページへ流入→外部リンクをクリック」は直帰として判断します。サイト内「ページへ流入→サイト内リンクをクリック」は直帰の計算対象となりません。
逆に偽義の場合は、リンク先が全て同じコンテンツとみなされるため、「ページへ流入→外部リンクをクリック」は直帰の対象とはなりません。サイト内「ページへ流入→サイト内リンクをクリック」は直帰の計算対象となります。

バナークリックは直帰として判断したくないので「偽」に設定、サイト内リンクは直帰扱いにしたくないので「真」に設定など、目的によって使い分けができます。Goodpatch Blogでは、ページ内遷移を直帰率計算の対象にしたくないため、「真」を設定しています。

テスト・リリースをしてみよう

こちらは、前回同様にテストを行います。

ワークスペースに戻り、プレビューを押してください。オレンジ色の背景で「プレビュー中のワークスペース」と出たらテスト実行中となります。

タグを入れたページへ行き、リンクを押してみましょう。

クリック時に「Tags Fired On This Event」にタグが表示されていることが確認できました。詳細を確認すると、変数が取得できていることも確認できます。

イベントが確認できたら、「プレビューモードを終了」をクリック、リリースを行って本番リリース完了です。

その他、色々な方法でイベントが取れる！

今回はイベント取得の基本として、全クリック数を計測するイベントタグ設定をご紹介しました。
他にもある要素が表示された時や、特定の動作を行った時にイベントを取得するなど、色々な方法で取得することができます。特殊なケースでイベントを取得する方法は、別の機会で応用編としてご紹介できればと思います。お楽しみに！

Share on

Goodpatch
Goodpatch公式アカウントです。