Skip to content
Products
/
/
/
Click Tracking
Last updated

Javascript SDKでのClick Tracking

この記事では、JavaScript SDKでclickイベントを追跡する方法について説明します。

前提条件

  • JavaScriptとHTMLの基礎知識。

  • Treasure Dataの基礎知識。

  • Treasure Data JavaScript SDKの基礎知識。

Treasure Dataは、本番環境で使用を開始する前に、サイトでTreasure Data JavaScript SDK version 3を使用した新機能や機能の実装を検証することをお勧めします。cookieの管理方法が異なります。これらの記事のほとんどを参照する際は、提案されたeventコレクターとTreasure Data JavaScript SDK version 3の呼び出しをソリューション内で定義する必要があることに注意してください。たとえば、//cdn.treasuredata.com/sdk/2.5/td.min.jsを//cdn.treasuredata.com/sdk/3.0.0/td.min.jsに変更します。

リンクのclickの追跡

ページビューを追跡できない外部サイトへのリンクがあり、ユーザーがどのリンクをクリックしたかを追跡したい場合:

  1. _onClick_を使用してlink-tagで_trackEvent_関数を呼び出してclickアクションを追跡します。

  2. 以下の例では、ユーザーがリンクをクリックしたときに、デフォルトの追跡データとlink_urlデータを_pageviews_ tableに送信します。

  3. オプションで、Google Tag Managerを確認してください。

<html>
  <head>
  <!-- Treasure Data -->
  <script type="text/javascript">
  !function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this["_"+t]=this["_"+t]||[],this["_"+t].push(Array.prototype.slice.call(arguments)),this}},s=["addRecord","blockEvents","fetchServerCookie","fetchGlobalID","fetchUserSegments","resetUUID","ready","setSignedMode","setAnonymousMode","set","trackEvent","trackPageview","trackClicks","unblockEvents"],n=0;n<s.length;n++){var c=s[n];e[t].prototype[c]=r(c)}var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=("https:"===document.location.protocol?"https:":"http:")+"//cdn.treasuredata.com/sdk/2.5/td.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)}}("Treasure",this);

  // Configure an instance for your database

  var td = new Treasure({
    protocol: 'https',
    host: 'in.treasuredata.com',
    writeKey: 'xxxxx', // PLEASE MODIFY HERE
    database: 'xxxxx'  // PLEASE MODIFY HERE
  });

  // Enable cross-domain tracking
  td.set('$global', 'td_global_id', 'td_global_id');

  // track pageview information to 'pageviews' table
  td.trackPageview('pageviews');

  function tracklink(link_url) {
    td.trackEvent('pageviews', {link_url: link_url});
  }
  </script>
</head>
<body>
  Hello Treasure Data!
    <A href="hellotd_link1.html" onClick="tracklink('hello_link1.html')">link1</A>
    <A href="hellotd_link2.html" onClick="tracklink('hello_link2.html')">link2</A>
    <A href="hellotd_link3.html" onClick="tracklink('hello_link3.html')">link3</A>
  </body>
</html>
Previous page
Next page