ディレクターでもコピペで簡単実装出来るGoogle Analyticsのイベントトラッキング

読了: 約 3 分

Google Analyticsを使ってサイトやメディアの分析をしている方が多いかと思います。グーグルアナリティクスで、ページのトラッキングだけでなく、ディレクターの要望に応じて『このリンクのイベント数を計測したい』という事があるかと思います。または、エンジニアの力を借りる事なく簡単に計測できるようにしたいという事がある場合に簡単にコピペで取得できる方法をご紹介します。

JS側の設定

  // 現在表示されているURLを取得
  function getUrl(){
    return location.href.replace(/\#.*$/, '').replace(/\?.*$/, '');
  }
  
  // aタグに付与
    $('.js-gaTracker').on('click',function(e){
      e.preventDefault();
      var elementId = $(this).attr('data-gaClickId') || "none";
      var href = $(this).attr("href");
      var currentUrl = getUrl();
      ga('send',{
        hitType: "event",
        eventCategory: currentUrl,
        eventAction: "click",
        eventLabel: elementId,
        hitCallback: function(){
          if(href) location.href = href;
        }
      });
    });

HTML側の設定

イベントを計測したい、リンクをどれだけ押されているか取得したいというHTMLを下記のように設定します。

<a href="特定のリンク" class="js-gaTracker" data-gaClickId="contact">

data-gaClickIdで、idを設定してそれを取得します。

各ページ毎にどの広告がクリックされているのか等を確認するために飛ばしています。 どこのページの、どの広告がクリックされているのかキャンペーンの設定等を行なえばより詳しく分析する事が出来るかと思います。

特にアフィリエイトをやっている方や広告担当者周りの方は、ASPによっては広告のクリック総数は分かるけど案件毎やその案件がどこのページでクリックされているかわからないというケースがありますよね。そういう時にぜひ使ってみてください。

これに応じてページ毎で広告を張り替えたり、色々PDCAを回し収益改善したり、リンクでないポップアップやチュートリアルに設定することで、シングルページのサイトでも突破しているかどうかを判断する事が出来ます。

まとめ

どんどん機能が追加されており複雑にんっているGoogle Analyticsですが、新しめのものでAmazonでも売れているGoogle Analyticsの参考書籍です。