計測タグに加えてカスタムイベントタグを設置することで、ユーザーの行動や属性を追加で取得することができます。

カスタムイベントタグとは？

計測タグが設置されたWebページでは、view（閲覧）イベントが自動で発生します。

さらにviewイベント以外のイベントをWebページ上から取得するには、カスタムイベントタグの設置が必要となります。

下記のようなイベントは、基本的にはカスタムイベントタグをWebページ上に設置することで取得します。

  • New membership registration
  • Campaign Applications/ Request for documents
  • Promotion and demotion of a user’s membership rank
  • Click event with no page redirection​ ​
  • カート商品の追加や削除

なお、各イベントはイベント名だけではなく、そのイベントに関連する値を連携するためのフィールドを持つことができます。
また各フィールドには、どのような性質のデータを連携するのかを定める「データ型」が、イベント送信時に設定されます。
詳しくはこちらをご参照ください。

カスタムイベントタグを設置する場所

該当のイベントを発生させたいページに設置してください。

カスタムイベントタグを実行するタイミング

ユーザーの動作をイベントとして取得したい場合、その動作が発生したタイミングでタグを実行してください。

また、カスタムイベントタグは必ず計測タグの後に実行されるように設置する必要があります。その理由は、計測タグの読み込みによってページ上に用意される関数を、カスタムイベントタグは利用しているからです。

カスタムイベントタグの記述方法

Below is a sample code that fires an event upon completion of membership registration.

<script type="text/javascript">
krt('send', 'signup');
</script>

If the tag shown above runs properly, a signup event will be fired in KARTE.​​

please note
  • イベント名には半角小文字英字(a-z)、半角数字(0-9)と'_'のみが使用できます。
  • イベント名には日本語などのマルチバイト文字を使用しないでください。

カスタムイベントタグの設置サンプル

Ex1: Tracking User Membership Registration

This is a sample code that fires a signup event when membership registration occurs.​​

<script type="text/javascript">
krt('send', 'signup');
</script>

Ex2: Tracking Document Requests and Application

This is a sample code that fires a request event when request for documents occurs.​​

<script type="text/javascript">
krt('send', 'request');
</script>

キャンペーンへの申し込みなどを計測したいといった場合では、「申し込まれたキャンペーンのIDも計測したい」という場合が想定されます。
​ ​In this case, by creating a custom event such as shown below, you can track the ID as an attribute of that custom event.

<script type="text/javascript">
krt('send', 'register', {id: "campaign123",
    plan: "silver"
});
</script>
  • registerというイベントでキャンペーンへの申し込みを定義し、その属性としてidキーに対し、キャンペーンIDcampaign123を付与しています
    You can freely add various parameters except for someparameters unable to use in tags.
  • On the KARTE management screenregisterというイベント名が表示されます
    サイト上のイベントを区別しやすいイベント名を設定してください。
  • KARTE管理画面上で表示されるregisterイベントにはplanという名称、sliverという値が紐付いて表示されます
    イベント内で区別しやすい名称を設定してください。
    registerというカスタムイベントはplan、silverTo saystring​ ​such as “gold” and “silver”, but you can also send numbers, dates, and booleans to track events.

例3 : セレクトボックスがクリックされたことをイベントとして送信する

通常、KARTEでイベントを計測する場合は、URL遷移(ページの移動)が必要です。
しかし、URL遷移のないクリックなどを計測することも可能です。
また、その際計測されたイベントを配信のトリガとすることも可能です。

<html>
<head>
</head>
<body>
<div class="example-box">
<select id="pulldown-menu">
    <option>A</option>
    <option>B</option>
    <option>C</option>
</select>
</div>
<script type="text/javascript">
(function(){
    var pulldownMenu = document.getElementById('pulldown-menu');
    pulldownMenu.addEventListener('change', function() {
        krt('send', 'onChange', {
            selected: this.selectedIndex
        });
    }, false);
})();
</script>
</body>
</html>

In this case, when the select box has been selected, an “onChange” custom event will be sent to KARTE.​ ​
The selected index value(A=0, B=1...) will be sent as a parameter called “selected”.

例4 : 特定のフォームにフォーカスが当たった時にイベントを発生させる

Below is an example of how you can fire an event when a field within web forms is focused (waiting for user input).

<script type="text/javascript">
(function(){
    // 要素を取得
    var inputElement = document.getElementById("target element id");

    // 処理を定義
    var action = function() {
        krt('send', 'onFocus', {
            selected: this.selectedIndex
        });
    }
    // イベントを設定
    inputElement.addEventListener("focus", action) ;
})();
</script>