EC-CUBEの環境にKARTEを導入するための手順をまとめたページです。各タグの設置箇所などは以下の各ページをご参照ください。
※以下の説明は、EC-CUBE 2系での利用を想定しています。3系を利用している場合でもKARTEの導入は可能ですが、設定方法が異なる部分があります。

EC-CUBE環境に計測タグを設置する

EC-CUBEへのKAETEタグの設置方法は、

  1. EC-CUBEへ直接設置
  2. Googleタグマネージャを用いた設置

の2通りがあります。

ここでは①に関してのみ解説します。
②に関しては、「タグマネージャ経由の設置」を参照してください。

計測タグの設置

EC-CUBE管理画面にログイン後、PCとスマートフォンについて、以下の部分に計測タグを設置してください。なお、以降のユーザータグ、 コンバージョンタグについてもヘッダー部分に設置します。
計測タグはアカウント開設フローの設定環境で「EC-CUBE」を選択後の「計測タグの設置」の項目のステップ1に出てきているタグをコピー&ペーストして利用ください。

PC

デザイン管理 → PC → ヘッダー/フッター設定に進んでください。
「ヘッダー編集」内最上部にKARTE管理画面から取得できる計測タグを設定してください。

スマートフォン

デザイン管理 → スマートフォン → ヘッダー/フッター設定に進んでください。
「ヘッダー編集」内最上部にKARTE管理画面から取得できる計測タグを設定してください。

EC-CUBEのカスタマイズ

KARTEで必要な情報を出力できるようにEC-CUBEをカスタマイズする

KARTEには「計測タグ」「ユーザータグ」「コンバージョンタグ」と3種類のタグがありますが、EC-CUBE標準の状態では、このうち「コンバージョンタグ」に必要な情報を取得することができません。
もし、GoogleAnalytics等でコンバージョン情報を取得するために、既にカスタマイズ済みの場合はこの項目でのカスタマイズは必要ありません。カスタマイズがまだの方は以下をご参照ください。

LC_Page_Shopping_Complete.phpの編集

下記のように注文者・注文情報を取得できるようにカスタマイズを行います。

public function action()
 {
     $this->arrInfo = SC_Helper_DB_Ex::sfGetBasisData();
      $objPurchase = new SC_Helper_Purchase();

      // コンバージョントラッキング用のコード
      if ($_SESSION['order_id']) {
          // 注文者データの取得
          $arrOrder = $objPurchase->getOrder($_SESSION['order_id']);
          // 注文商品データの取得
          $arrOrderDetail = $objPurchase->getOrderDetail($_SESSION['order_id']);  

          $this->arrGAOrder = $arrOrder; // Smartyに渡す
          $this->arrGAOrderDetail = $arrOrderDetail; // Smartyに渡す
          unset($_SESSION['order_id']);
      }
 }

これで注文完了画面にて、$arrOrderで注文情報を、$arrOrderDetailで注文明細情報を参照することができます。

EC-CUBE環境にユーザータグを設置する

本項目は「EC-CUBEのカスタマイズ」を完了していることを前提とします。

ユーザータグの設置

計測タグの下に下記のタグを挿入してください。

※ユーザータグは計測タグが読み込まれていないと動作しません。必ず計測タグの下に挿入してください。
なお、LC_Page_Shopping_Complete.phpを独自にカスタマイズしている場合は、下記のタグを挿入しても正常にデータが取得できない場合があります。

<!--{if $smarty.session.customer.customer_id}-->
<script type="text/javascript">
(function(){
  if('tracker' in window){
    if(location.protocol === 'https:'){
      try{
        var __karte_user = {};
        __karte_user.user_id =  '<!--{$smarty.session.customer.customer_id}-->';
        __karte_user.name =  '<!--{$smarty.session.customer.name01}--> <!--{$smarty.session.customer.name02}-->';
        __karte_user.name01 =  '<!--{$smarty.session.customer.name01}-->';
        __karte_user.name02 =  '<!--{$smarty.session.customer.name02}-->';
        __karte_user.kana01 =  '<!--{$smarty.session.customer.kana01}-->';
        __karte_user.kana02 =  '<!--{$smarty.session.customer.kana02}-->';
        __karte_user.zip01 =  '<!--{$smarty.session.customer.zip01}-->';
        __karte_user.zip02 =  '<!--{$smarty.session.customer.zip02}-->';
        __karte_user.pref =  '<!--{$smarty.session.customer.pref}-->';
        __karte_user.addr01 =  '<!--{$smarty.session.customer.addr01}-->';
        __karte_user.addr02 =  '<!--{$smarty.session.customer.addr02}-->';
        __karte_user.email =  '<!--{$smarty.session.customer.email}-->';
        __karte_user.email_mobile =  '<!--{$smarty.session.customer.email_mobile}-->';
        __karte_user.tel01 =  '<!--{$smarty.session.customer.tel01}-->';
        __karte_user.tel02 =  '<!--{$smarty.session.customer.tel02}-->';
        __karte_user.tel03 =  '<!--{$smarty.session.customer.tel03}-->';
        __karte_user.fax01 =  '<!--{$smarty.session.customer.fax01}-->';
        __karte_user.fax02 =  '<!--{$smarty.session.customer.fax02}-->';
        __karte_user.fax03 =  '<!--{$smarty.session.customer.fax03}-->';
        __karte_user.gender =  '<!--{$smarty.session.customer.sex}-->';
        __karte_user.job =  '<!--{$smarty.session.customer.job}-->';
        var birth_date = '<!--{$smarty.session.customer.birth}-->';
        if(birth_date!==''){
            __karte_user.birth_date =  new Date(birth_date);
        }
        var first_buy_date = '<!--{$smarty.session.customer.first_buy_date}-->';
        if(first_buy_date!==''){
            __karte_user.first_buy_date =  new Date(first_buy_date);
        }
        var last_buy_date = '<!--{$smarty.session.customer.last_buy_date}-->'
        if(last_buy_date!==''){
            __karte_user.last_buy_date =  new Date(last_buy_date);
        }
        var buy_times = '<!--{$smarty.session.customer.buy_times}-->';
        if(buy_times!=='' && !isNaN(buy_times)){
            __karte_user.buy_times =  Number(buy_times);
        }
        var buy_total =  '<!--{$smarty.session.customer.buy_total}-->';
        if(buy_total!=='' && !isNaN(buy_total)){
            __karte_user.buy_total = Number(buy_total);
        }
        var point = '<!--{$smarty.session.customer.point}-->';
        if(point!=='' && !isNaN(point)){
            __karte_user.point =  Number(point);
        }
        __karte_user.note =  '<!--{$smarty.session.customer.note}-->';
        __karte_user.status =  '<!--{$smarty.session.customer.status}-->';
        var create_date = '<!--{$smarty.session.customer.create_date}-->';
        if(create_date!==''){
            __karte_user.create_date =  new Date(create_date);
        }
        var update_date = '<!--{$smarty.session.customer.update_date}-->';
        if(update_date!==''){
            __karte_user.update_date =  new Date(update_date);
        }
        __karte_user.del_flg =  '<!--{$smarty.session.customer.del_flg}-->';
        __karte_user.cell01 =  '<!--{$smarty.session.customer.cell01}-->';
        __karte_user.cell02 =  '<!--{$smarty.session.customer.cell02}-->';
        __karte_user.cell03 =  '<!--{$smarty.session.customer.cell03}-->';
        __karte_user.mobile_phone_id =  '<!--{$smarty.session.customer.mobile_phone_id}-->';
        var subscription =  '<!--{$smarty.session.customer.mailmaga_flg}-->';
        if(subscription==='true' || subscription==='false'){
            __karte_user.subscription = subscription==='true';
        }
      }catch(e){
        tracker.track('_error',{message: e.message});
      }finally{
        if(Object.keys(__karte_user).length > 0){
            tracker.user(__karte_user);
        }
      }
    }
  }
})()
</script>
<!--{/if}-->

EC-CUBE環境にコンバージョンタグを設置する

本項目は「EC-CUBEのカスタマイズ」を完了していることを前提とします。

コンバージョンタグの導入

計測タグの下に下記のタグを挿入してください。

※ ユーザータグと同様に、コンバージョンタグも計測タグが読み込まれていないと動作しません。ユーザータグとの順番はどちらでも構いません。

<!--{if $smarty.server.PHP_SELF == "`$smarty.const.ROOT_URLPATH`shopping/complete.php"}-->
<script type="text/javascript">
(function(){
  if('tracker' in window){
    try{
      var __karte_items = [];
    <!--{section name=cnt loop=$arrGAOrderDetail}-->
      try{
        var __karte_item = {};
        __karte_item.item_id = '<!--{$arrGAOrderDetail[cnt].product_id}-->';
        __karte_item.name = '<!--{$arrGAOrderDetail[cnt].product_name}-->';
        __karte_item.category = ['<!--{$arrGAOrderDetail[cnt].classcategory_name1}-->'];
        var price = '<!--{$arrGAOrderDetail[cnt].price}-->';
        if(price!=='' && !isNaN(price)){
          __karte_item.price = Number(price);
        }
        var quantity = '<!--{$arrGAOrderDetail[cnt].quantity}-->';
        if(quantity!=='' && !isNaN(quantity)){
          __karte_item.quantity = Number(quantity);
        }
      }catch(e){
        tracker.track('_error',{message:e.message});
      }finally{
        if(Object.keys(__karte_item).length > 0){
          __karte_items.push(__karte_item);
        }
      }
    <!--{/section}-->
      var __karte_buy = {};
      __karte_buy.transaction_id = '<!--{$arrGAOrder.order_id}-->';
      var revenue = '<!--{$arrGAOrder.total}-->';
      if(revenue!=='' && !isNaN(revenue)){
        __karte_buy.revenue = Number(revenue);
      }
      __karte_buy.shipping = 0;
      __karte_buy.tax = 0;
      __karte_buy.items = __karte_items;
    }catch(e){
      tracker.track('_error',{ message: e.message });
    }finally{
      if(Object.keys(__karte_buy).length > 0){
          tracker.buy(__karte_buy);
      };
    }
  }
})()
</script>
<!--{/if}-->

EC-CUBE環境にカートタグを設置する

本項目は「EC-CUBEのカスタマイズ」を完了していることを前提とします。

カートタグの導入

EC-CUBEの、「デザイン管理 > PC/モバイル > ページ詳細設定 > 現在のカゴの中 > ページ詳細」から、以下のスクリプトを追加してください。

<!--{if count($cartItems) > 0}-->
<script type="text/javascript">
var __karte__cart = {};
var __karte__items = [];
__karte__cart.status = true;
<!--{foreach from=$cartKeys item=key}-->
__karte__cart.price = <!--{$tpl_total_inctax[$key]}-->+0;
<!--{foreach from=$cartItems[$key] item=item}-->
__karte__items.push({
  category1: "<!--{$item.productsClass.classcategory_name1}-->",
  category2: "<!--{$item.productsClass.classcategory_name2}-->",
  name:      "<!--{$item.productsClass.name|h}-->",
  price:      <!--{$item.price_inctax|h}-->+0,
  quantity:   <!--{$item.quantity|h}-->+0,
  subtotal:   <!--{$item.total_inctax|h}-->+0
});
<!--{/foreach}-->
<!--{/foreach}-->
__karte__cart.items = __karte__items;
tracker.track("cart", __karte__cart);
</script>
<!--{/if}-->