グーグルアナリティクス

Googleアナリティクスのgtag.jsのイベントでカスタムパラメーターを利用する方法

えーと、以前からGoogleアナリティクスのイベントを利用して、ページ内のユーザーの行動を計測していました。

この度、gtag.js という新しいバージョンになって、イベントに自分が好きな値を設定できるカスタムパラメーターというのができたようなので、試してみた経緯を共有します。

gtag.js でのevent（イベント）計測方法

まぁ、もうあちこちでやり方が公開されているので、詳しくは書きませんが、

従来のanalytics.js だと

ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

という感じで定義されてて

「https://blog.valid-seo.biz/という外部サイトにテキストリンクをクリックで移動」

というのを計測しようと思ったらテキストリンクの部分に

<a href="https://valid-seo.biz/" onclick="ga('send', 'event', 'outbound', 'click-text', 'https://valid-seo.biz/', 0;">VALID SEO</a>

という感じで仕込みをしてました。

  • イベントカテゴリ ＝ outbound
  • イベントアクション ＝ click-text
  • イベントラベル ＝ https://valid-seo.biz/
  • イベント価値 ＝ 0

ということですね。

それが gtag.js だと、

gtag('event', 'event_name', {
  'event_category': categoryName,
  'event_label': labelName
});

グーグルさんの英語版ガイドページより

ということで、

<a href="https://valid-seo.biz/" onclick="gtag('event', 'click-text', {'event_category': 'outbound', 'event_position': 'eye-catch', 'event_label': 'https://valid-seo.biz/', 'value': '0'});"></a>

な感じに書き換えると gtag.js でも計測できるようになります。

訂正 2018/02/22 23:58:17）
上記に一部誤りがありましたのでお詫びして訂正します。

グーグルアナリティクス上の「イベントアクション」は、「event_name」の部分です。
カテゴリと入れ替わってました。

gtag.js でのevent（イベント）で新しく計測できるようになったカスタムパメーター

うちのケースのgtag.js のイベントの書き方で、

event_position

なんて設定が出てきてますが、これが gtag.js で可能になった

カスタムパラメーター

でございます。

自分の好きなパラメータをイベント発生時に設定できる、という機能ですねー。

analytics.js には無かった（と思う）便利な機能です。

というのも、ページ内に同じ遷移先への複数のリンクがある場合（特にLPとかアフィリエイトページとか）には、

どのリンクがクリックされて、オーダーに繋がった？

というのは非常に知りたい情報です（個人的には）。

 
以前のanalytics.jsだと、アクションか、ラベルかどっちかに場所の情報も入れて計測してました。
 
まぁ、サイト横断的にアイキャッチのクリック率が高いのか、フッターのリンクのクリック率が高いのかを計測したい場合とかに使うんですけども。

 
 
ただこんなことやってると、

「自社サイトでは、テキストリンクの方がクリック率高いのか？バナーリンクの方がクリック率が高いのか？」

というようなことを横断的に計測したい場合にラベルとか、アクションに入れてるとパッと見てやりづらかったです。

 
今回、カスタムパラメーターを設定できるようになって、クリック場所の情報を独立して計測できるようになる！ということなんですね。

で、早速設定してみたんですが、「行動」→ イベント 関連のページではカスタムパラメーターの情報は表示されませんでした。

 
どこで見れるのかー・・・と思ってマニュアル読んだり、アナリティクスのフォーラムに相談したりしましたが、よくわからず・・・。
 

改めて、gtag.js の設定マニュアルを再度読み直すと、カスタムディメンションとメトリックスの設定解説ページにヒントがありました。

gtag.jsのイベントでカスタムパラメーターを使うにはディメンションへ送る設定が必要

ディメンションに送れるように設定しても最後のイベントの値が上書きされてしまう・・・など途中色々ありましたが、最終的には下記の手順で無事、gtag.jsのeventでCustom parameters を Google Analyticsの画面で見れるようになりました。

 

  1. 対象の管理サイトの管理画面「プロパティ」の「カスタム定義」で「カスタムディメンション」を追加する
  2. 追加するディメンション名は、カスタムパラメーターのパラーメーター名に合わせる（うちの場合は、event_position、サイト内にも設定しますので、日本語じゃない方がいいのかなー？？）
  3. カスタムディメンションの「範囲」は「ヒット」にする（最初「セッション」にしてたら、最後のイベントの値しか取れませんでした。）
  4. 設定したカスタムディメンションの設定をアクティブにして保存
  5. 保存後にPCだと横に出てくるディメンションのサンプルコードは、analytics.js用で、gtag.js用じゃないので無視
  6. サイトに戻り、Google Analytics のコードを書いている部分に、gtag.js用のカスタムディメンションの設定を追加
    ↓な感じ

    <script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-NNNNNNNNN-1',
       {
          'link_attribution': true
         ,'custom_map': { 'dimension1' : 'clientId' ,'dimension2' : 'event_position' }
       }
  );
</script>

    gtagのconfig部分にcustom_mapというハッシュセットデータを設定すればOKということですねー。

    うちは、他にclientIdの値も取るようにしたので、カスタムディメンションの1にクライアントID、カスタムディメンションの2に、イベントのカスタムパラメーターを設定するようにしてます。

    カスタムディメンションのパラメーターの数値（dimension1、dimension2とか）は、アナリティクスに追加した際に勝手に振られる「インデックス」の数字です。
    　
    管理画面の「プロパティ」 → 下の方の「カスタム定義」 → 「カスタムディメンション」で確認してください。

  7. あとは、↓みたいに計測したいイベント発生ポイントにonclickなどでイベントを仕込んでいく 
    <a href="https://valid-seo.biz/" onclick="gtag('event', 'outbound', {'event_category': 'click-text', 'event_position': 'eye-catch', 'event_label': 'https://valid-seo.biz/', 'value': '0'});"></a>

という感じです。

gtag.js 便利！

この設定した御蔭で、ユーザーエクスプローラーで成果に繋がった方の詳細な行動を見れたり、ページのどこまで見て離脱したか？が凡そ判るようになったりと、各段に情報が取れるようになりました。

LPの改善には欠かせない情報じゃないでしょうかねー？

　
今回は情報が少なすぎて大変だったのですが、なんとか設定できてよかったので興奮気味にシェアしてみました（笑）

あなたのお役に立てていれば幸いです。
 

 

↓拡散のお手伝いお願いします

Recommend関連記事

関連記事は見つかりませんでした。