アクセス解析 2019.12.20

GoogleAnalytics イベントトラッキングの設定方法と目標設定の追加方法をご紹介!

サイトのアクセス解析のためにGoogleAnayticsを活用している方の中には、コンバージョンやセッション数、ユーザー数をよく見る方は多いと思います。一方でGoogleAnalyticsの「イベントトラッキング機能」を活用している方は少ないのではないでしょうか? 

イベントトラッキング機能を使えば、通常のトラッキングタグだけでは計測が出来ないユーザーのアクションがカウント出来るため、使い方次第ではCVR改善などに繋がる発見ができます

今回は、イベントトラッキングを設定する具体的なメリットや設定方法が分からないという方に向けて、設定しておくとサイト改善に役立つ、イベントトラッキングの使い方について解説します。

イベントトラッキングを設定することで出来ること

イベントトラッキングを利用すると、例えば以下のようなことが可能です。今回は以下の具体的な活用事例と、それぞれの設定方法についてご紹介します。

  • 電話ボタンのタップ数をカウントする
  • 広告のクリック数を計測する
  • LP内でよく押されているコンバージョンボタンを特定する 

※あくまでこれらはイベントトラッキング機能の活用方法の一例であり、ほかにもサイトの特徴に合わせて様々な活用方法があります。

事前確認!GoogleAnalyticsの種類によってイベントトラッキングの設定方法が違う

GoogleAnalytics

イベントトラッキングをするには、サイトでGoogleAnlyticsのトラッキングコードとは別でタグを埋め込む必要がありますが、そのタグの形式がGoogleAnlyicsの種類によって違うので要注意です

具体的には「ユニバーサルアナリティクス(最新バージョン)」と「通常のアナリティクス(旧バージョン)」の2種類があります。細かい説明はここでは省略しますが、この記事では種類別に設定方法をご紹介しますので、事前にご自身のサイトがどちらのバージョンを利用しているか事前に調べておきましょう。

見分け方1.GoogleAnalyticsの利用開始をした時期で判断

ユニバーサルアナリティクスは2014年4月に公開されたので、それ以降にGoogleAnalyticsを利用開始した方は基本的にユニバーサルアナリティクスを利用していると考えて大丈夫です。

見分け方2. GoogleAnalyticsのトラッキングコードで判断

サイトのソースに入っているトラッキングコードで通常のバージョンかユニバーサルアナリティクスかを見分けることが可能です。

※GoogleTagManegerを利用している方はそちらでタグをご確認ください

▼以下のタグが入っている場合は通常のアナリティクスです。

<script type=”text/javascript”>

  var _gaq = _gaq || [];

  _gaq.push([‘_setAccount’, ‘UA-*******-**’]);

  _gaq.push([‘_trackPageview’]);

  (function() {

    var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;

    ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;

    var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);

  })();

</script>

▼以下のタグが入っている場合はユニバーサルアナリティクスです。

<script>

  (function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){

  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

  })(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

  ga(‘create’, ‘UA-*******-**’, ‘setAccount’);

  ga(‘send’, ‘pageview’);

</script>

知っておこう!イベント名のつけ方

GoogleAnalyticsでページビュー数を見る場合、自動的にURLやページのタイトルを取得し、それごとに数字を見ることが出来ると思います。一方でイベントトラッキングの場合は、各項目でご自身の好きな名前をつけて管理画面上で数字を見ることができます。

GoogleAnalyticsのイベント分析画面
GoogleAnalyticsのイベント分析画面

カテゴリ・アクション・ラベル

GoogleAnalyticsのイベント分析画面
イベント計測画面の赤枠の部分で、イベントカテゴリ、アクション、ラベルをクリックするとそれぞれの区分でイベント数が見れます

イベント名は1つのイベントにつき「カテゴリ」「アクション」「ラベル」という3種類つける事ができます。はじめての方にとってはややこしいかもしれませんが、3つの区分でイベント数の集計をすることができるので便利です。

例えばですが、以下のような設定をしておけば、イベントが発生したページのURLだけでなく、ページの中のどの位置でそのイベントが発生したのかが見れるようになります。

区分概要設定名の例
カテゴリイベントが発生した箇所グローバルナビ、フッター、追従ボタンetc
アクションどんな行動をしたか電話、スクロール、サイト離脱etc
ラベル そのイベントが発生したページTOP、LP、サービス紹介ページetc

CASE1 電話ボタンのタップ数をカウントする

スマートフォンをもつ女性

電話がコンバージョンポイントのサイトは便利

コンバージョンをカウントするタイミングは、ECサイトであれば購入完了画面、コーポレートサイトであれば問い合わせ完了画面への訪問数をコンバージョン数としてカウントするのが一般的です。

一方で、電話をコンバージョンとするサイトの場合はスマホ画面から電話ボタンをタップしても画面遷移が発生しないので、その数を知ることができません

そんな時に便利なのがイベントトラッキング機能です。厳密に電話を掛けた回数はカウントできませんが「電話ボタン」をタップされた数をイベントトラッキング機能でカウントすることが可能です。

電話のタップ数をイベント数としてでカウントする方法

ソース内にある電話ボタンのソースへ以下のタグを追加すると電話のタップ数をイベント数としてカウントすることができます。 ※赤文字が追加部分

■通常のGoogleAnalyticsの場合のタグ

<a href=”tel:XXX-XXXX-XXX” onclick=”_gaq.push([‘_trackEvent’, ‘[設置位置名]’, ‘call’, ‘[設置ページ名]’, 1]);”>

■ユニバーサルアナリティクスの場合のタグ

<a href=”tel:XXX-XXXX-XXX” onclick=”ga(‘send’, ‘event’, ‘[設置位置名]’, ‘call’, ‘[設置ページ名]’, 1);”>

電話ボタンのイベントをコンバージョンポイント(目標)として設定する

①GoogleAnalytivcsの画面左下の「管理」ボタンをクリック

GoogleAnalyticsの管理画面
左下の設定マークをクリックするとこちらの画面が表示されます

②対象のビューを選択し「目標」をクリック。「新しい目標を設定」ボタンを押下する。

GoogleAnalyticsの目標設定画面
左上の赤いボタンが「新しい目標を設定」ボタンです

③目標設定の中にある「カスタム」にチェックを入れて「続行」ボタンを押下する

GoogleAnalyticsの目標設定画面

④目標の説明の中にある「名前」に適当な名前を入力し、設定したい目標スロットIDを選択する。※何も目標設定していない人は初期設定の 目標 ID 1 / 目標セット 1 のままで大丈夫です

GoogleAnalyticsの目標設定画面

⑤目標の詳細の中にあるイベント条件の「アクション」に「call」を入力して「保存」ボタンをクリックする

GoogleAnalyticsの目標設定画面

これで設定完了です。

CASE2 広告のクリック数を計測する

スマートフォンを持つ手

Webメディアやアフィリエイトサイトは便利

サイト内の広告や、別サイトへの送客によって収益を得られるサイトにおいては、広告や他サイトへのリンクのクリック数が計測できると便利です。

GoogleAnalyticsは、サイト内の画面遷移は自動で取得してくれますが、サイト外への遷移を取得するにはイベントトラッキングを設定する必要があります。

広告のクリックをイベント設定し、クリックイベント発生をコンバージョンとして設定すれば、例えばどのようなページから入ったサイトが広告クリックに繋がりやすいか、などを特定することが可能です。

広告のクリック数をイベント数として計測する方法

広告のリンク部分のソースへ以下のタグを追加すると、広告のクリック数をイベント数としてカウントすることができます。  ※赤文字が追加部分

■通常のGoogleAnalyticsの場合のタグ

<a href=”http://XXXX/XXXXX”  onclick=”_gaq.push([‘_trackEvent’, ‘[設置位置名]’,’adclick’, ‘[設置ページ名]’, 1]);”>

■ユニバーサルアナリティクスの場合のタグ

<a href=”http://XXXX/XXXXX” onclick=”ga(‘send’, ‘event’, ‘[設置位置名]’, ‘adclick’ , ‘[設置ページ名]’, 1);”>

広告のイベント数をコンバージョンポイント(目標)として設定する

電話ボタンのイベントをコンバージョンポイント(目標)として設定する」と同様の手順で⑤目標の詳細の中にあるイベント条件の「アクション」に入力する文字列を「adclick」にして設定するだけです。

CASE3 LP内でよく押されているコンバージョンボタンを特定する

複数のボタン

LP(ランディングページ)の改善運用に便利

広告専用のランディングページ(LP)を用意して日々ページのデザインなどを改善している方は多いのではないでしょうか?

LPには通常、複数の同一コンバージョンボタンが設置されていますがGoogleAlayticsではどのボタンを押しても 同じLPから同じコンバージョンページへの遷移としてカウントされます。

イベントトラッキングを利用すれば同一ページ内で、どのコンバージョンボタンがよく押されているかを特定することができますので、つまりどのようなコンテンツがコンバージョンに寄与したのかが分かるので便利です。そのようなコンテンツが判明すれば、それをページ上部に表示させたり、コンテンツの内容をリッチにすることによってCVR向上が見込めるのではないでしょうか?

コンバージョンボタンのクリック数をイベント数として計測する方法

コンバージョンボタン部分のソースへ以下のタグを追加するとボタンのクリック数をイベント数としてカウントすることができます。  ※赤文字が追加部分

■通常のGoogleAnalyticsの場合のタグ

<a href=”http://XXXX/XXXXX” onclick=”_gaq.push([‘_trackEvent’, ‘[設置位置名]’,’click_cv’, ‘[設置ページ名]’, 1]);”>

■ユニバーサルアナリティクスの場合のタグ

<a href=”http://XXXX/XXXXX” onclick=”ga(‘send’, ‘event’, ‘[設置位置名]’, ‘click_cv’ , ‘[設置ページ名]’, 1);”>

ボタンのクリック数をコンバージョンポイント(目標)として設定する

電話ボタンのイベントをコンバージョンポイント(目標)として設定する」と同様の手順で⑤目標の詳細の中にあるイベント条件の「アクション」に入力する文字列を「click_cv」にして設定するだけです。

イベントトラッキングは画面遷移以外の計測に使うと便利

イベントトラッキングは、GoogleAnalyticsがデフォルトでカウントしてくれるページビューや画面遷移以外のアクションを計測する際に非常に便利です。

「うちのサイトはコンバージョンポイントが荷電だから、サイトの効果が正確に分からない!」という方も、この記事を参考にしながらイベントトラッキングの設定をしてみてください。ご自身のサイトの実力が見えるようになるはずです!

ヒトノテロゴ

執筆者:天野良香

株式会社ヒトノテのCMO兼グロースハッカー。データ分析をもとにしたCVRやUI/UX等のサイト改善が得意です。

ヒトノテ坪昌史

監修者:坪昌史

株式会社ヒトノテの代表取締役CEO。 エンジニアとしてキャリアスタートし、サイバーエージェントのSEO分析研究機関を経て、リクルートの横断マーケティング組織のマネージャー&全社SEO技術責任者を務める。その後、独立しSEOを中心としたクライアントの課題解決を行う。2017年、株式会社ヒトノテを創業し、様々な企業のウェブマーケティングの支援を行う。