2018年1月16日(火)よりサポートサイトはhttps://support2.karte.ioへ移行しました。

カート落ち / カート内金額などカート関連情報を計測する

 

カスタムイベントタグを利用することで、カート落ち/カート内金額などの情報をKARTEで計測できます。
※以下の内容はカスタムイベントタグの仕様に準じ、すべて計測タグ読み込み後にタグを設置する必要があります。

またこのドキュメントでは"cart"というカスタムイベント名を使用していますが、カスタムイベント名は任意の名称で設定いただけます。

 

1.カート落ちの計測
2.カート内金額の計測
3.カスタムイベントや、その他のタグとの組み合わせ例

 

なお、商品IDを含む全ての情報を取得するためのカートタグは、以下のようなものになります。

<script type="text/javascript">
try{
// 実際のアイテム数に応じて、全てのアイテム情報を出力してください
var items = [{
item_id: '001',
name: 'テスト商品1',
  category: 'テストカテゴリ',
price: 1000,
quantity: 1
}, {
item_id: '002',
name: 'テスト商品2',
category: 'テストカテゴリ',
price: 980,
quantity: 1
}];
// 接客サービス内でitem_idのリストを取得できるように、実際のアイテム数に応じて、全てのitem_idを出力してください
var item_ids = ['001', '002'];

tracker.track("cart", { price: 1980, status: true,
items: items,
item_ids: item_ids }); }catch(e){ if('tracker' in window){ tracker.track('_error',{ message: e.message }); } } </script>

1. カート落ちの計測


カート落ちを計測する場合、「カートページ」と「購入完了ページ」にカスタムイベントタグを設置します。
※「カートページ」はサイト上で「カートへ進む」というフォーム等から遷移したページを指します。

カート落ちの計測では"cart"というカスタムイベントでの"status"というパラメータ計測が基本となり、

  • 「カートに入った(=カートページを閲覧した)」場合
    「status: true」

  • 「購入完了した(=購入完了ページを閲覧した)」 場合
    「status: false」

というパラメータを計測します。

このようなパラメータを計測することで、

  • 計測された"cart" の"status"がtrueであれば「カートに入ったが購入完了していない」
  • 同様に"cart" の"status"がfalseであれば「カートに入って購入完了した」

という状態をKARTE上で識別できます。

以下が「カートページ」、「購入完了ページ」に設置するタグの例です。

カートページに設置するタグ

<script type="text/javascript">
try{
tracker.track("cart", {
status: true
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>

購入完了ページに設置するタグ

<script type="text/javascript">
try{
tracker.track("cart", {
status: false
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>

2. カート内金額の計測


カート内金額を計測する場合は、カート内の金額が変わるタイミングでカスタムイベントを計測します。
最もシンプルな形式では「カートページ」と「購入完了ページ」にカスタムイベントタグを設置します。

この場合は"cart"というカスタムイベントで"price"というパラメータを計測しますが、たとえばカートに進んだ際にカート内金額が1,000円の場合は、

  • 「カートに入った(=カートページを閲覧した)」時に「price: 1000」
  • 購入完了した(=購入完了ページを閲覧した)」 時に「price: 0」で状態をリセット

というパラメータを計測します。

※カート内金額を動的に出力する必要があります。

以下が「カートページ」、「購入完了ページ」に設置するタグの例です。
「カートページに設置するタグ」については、カートシステムやカートASPにあわせ、「カート内の金額が変わるページ」に適宜出力してください。


カートページに設置するタグ(status計測と合わせたもの)

<script type="text/javascript">
try{
tracker.track("cart", {
price: 1000,
status: true
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>

購入完了ページに設置するタグ(status計測と合わせたもの)

<script type="text/javascript">
try{
tracker.track("cart", {
price: 0,
status: false
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>

 

3. カスタムイベントや、その他のタグとの組み合わせ例>


上記の例のようにカート落ち/カート内金額の計測は、下記のような形式で1つのタグにまとめることも可能です。

cartのパラメータをまとめたタグ(購入完了ページ例)

<script type="text/javascript">
try{
tracker.track("cart", {
status: false,
price: 0
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>

※パラメータの最終行以外の行では、パラメータ末尾の「,」が抜けていた場合にエラーが発生するため注意してください。

またコンバージョンタグと組み合わせて購入完了ページに設置する場合は、下記の様な形式で2つのScriptタグを設置いただければどちらも計測されます。


購入完了ページにコンバージョンタグとcartのカスタムイベントタグを同時出力する例

<script type="text/javascript">
try{
tracker.buy({
transaction_id: "0001",
price: 1000
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>
<script type="text/javascript">
try{
tracker.track("cart", {
status: false,
price: 0
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>

 

カート内のアイテム情報を出力する

以下の形式でカート内情報をお送りいただくと、接客サービスのテンプレート内で最新のカート内商品IDを用いた表示制御をすることができます。

<script type="text/javascript">
try{
// 実際のアイテム数に応じて、全てのアイテム情報を出力してください
var items = [{
item_id: '001',
name: 'テスト商品1',
category: 'テストカテゴリ',
price: 1000,
quantity: 1
}, {
item_id: '002',
name: 'テスト商品2',
category: 'テストカテゴリ',
price: 980,
quantity: 1
}];
// 接客サービス内でitem_idのリストを取得できるように、実際のアイテム数に応じて、全てのitem_idを出力してください
var item_ids = ['001', '002'];

tracker.track("cart", { price: 1980, status: true,
items: items,
item_ids: item_ids }); }catch(e){ if('tracker' in window){ tracker.track('_error',{ message: e.message }); } } </script>

商品が空の場合は、以下のように、商品が空で、status: falseで実行されるようにしてください。

<script type="text/javascript">
try{
var items = [];
var item_ids = [];
tracker.track("cart", {
price: 0,
status: false,
items: items,
item_ids: item_ids
});
}catch(e){
if('tracker' in window){
tracker.track('_error',{
message: e.message
});
}
}
</script>