EC-CUBE - タグ実装ガイド

eccube_top

EC-CUBE Ver 3をお使いのウェブサイトには、このガイドでご紹介するタグをコピー&ペーストしていただくことで簡単にCriteoのタグが実装ができます。

目次

  1. トップページタグ

  2. 商品一覧ぺージタグ

  3. 商品詳細タグ

  4. カートタグ

  5. コンバージョンタグ

はじめに

サンクスページでコンバージョンタグに必要なデータを出力させるため、次のファイルを変更してください。

ファイル名

..src/Eccube/Controller/ShoppingController.php

変更前:

     return $app->render('Shopping/complete.twig', array(
            'orderId' => $orderId,
        ));

変更後:

        return $app->render('Shopping/complete.twig', array(
            'orderId' => $orderId,
            'Order' => $Order,
            'Hashed' => hash('sha256', md5($Order->getEmail()))
        ));

1・トップページタグを実装する

EC-CUBE管理画面ー> コンテンツ管理ー> ページ管理ー> TOPページ ページ編集をクリック eccube_edit_page

{% endblock %}の直前に以下のタグを挿入して登録をクリック

<!--Criteo BEGIN-->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
window.criteo_q = window.criteo_q || [];
window.criteo_q.push(
        { event: "setAccount", account: {{accountid}} },
        { event: "setSiteType", type: /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d" },
        { event: "viewHome" , ecpplugin: "ec-cube"}
);
</script>
<!--Criteo END-->

eccube_top

2・一覧ページタグを実装する

EC-CUBE管理画面ー> コンテンツ管理ー> ページ管理ー> 商品一覧ページ ページ編集をクリック

{% endblock %}の直前に以下のタグを挿入して登録をクリック

<!--Criteo BEGIN-->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">

  var crto_list =[];
   {% for crto_list in pagination %}
  crto_list.push("{{ crto_list.id }}");
   {% endfor %}

    if(crto_list.length > 0){
        crto_list_top3 =[];
        for(var i =0; i< 3; i++){
            if(crto_list[i] !== undefined){
                crto_list_top3.push(crto_list[i]);
            }
        }

        window.criteo_q = window.criteo_q || [];
        window.criteo_q.push(
            { event: "setAccount", account: {{accountid}} },
            { event: "setSiteType", type: /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d" },
            { event: "viewList", item: crto_list_top3, ecpplugin: "ec-cube"}
        );
     }

</script>
<!--Criteo END-->

3・詳細ページタグを実装する

EC-CUBE管理画面ー> コンテンツ管理ー> ページ管理ー> 詳細ページ ページ編集をクリック

{% endblock %}の直前に以下のタグを挿入して登録をクリック

<!--Criteo BEGIN-->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">

 window.criteo_q = window.criteo_q || [];
 window.criteo_q.push(  
    { event: "setAccount", account: {{accountid}} },
    { event: "setSiteType", type: /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d"  },
    { event: "viewItem", item: {{ Product.id }}, ecpplugin: "ec-cube" }
  );            

</script>
<!--Criteo END-->

4・カートページタグを実装する

EC-CUBE管理画面ー> コンテンツ管理ー> ページ管理ー> 現在のカゴの中 ページ編集をクリック

{% endblock %}の直前に以下のタグを挿入して登録をクリック

<!--Criteo BEGIN-->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
  var crto_items =[];
    {% for crto_CartItem in Cart.CartItems %}
    {% set crto_ProductClass = crto_CartItem.Object %}
    {% set crto_Product = crto_ProductClass.Product %}
        crto_items.push({id:"{{crto_Product.id}}", price:{{crto_CartItem.price}},quantity:{{crto_CartItem.quantity}}});
    {% endfor %}

         if(crto_items.length > 0){
          window.criteo_q = window.criteo_q || [];
          window.criteo_q.push(
            { event: "setAccount",  account: {{accountid}} },
            { event: "setSiteType", type: /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d"},
            { event: "viewBasket",item: crto_items, ecpplugin: "ec-cube"}
          );
         }
</script>
<!--Criteo END-->

5・CVページタグを実装する

EC-CUBE管理画面ー> コンテンツ管理ー> ページ管理ー> 商品購入/ご注文完了 ページ編集をクリック

{% endblock %}の直前に以下のタグを挿入して登録をクリック

<!--Criteo BEGIN-->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">

  var crto_items =[];

{% for crto_OrderDetail in Order.OrderDetails %}
  crto_items.push({id:"{{ crto_OrderDetail.product.id }}", price:"{{ crto_OrderDetail.price }}",quantity:"{{ crto_OrderDetail.quantity }}"});
{% endfor %}

{% if orderId %}
  var crto_transaction_id = "{{ orderId }}";
{% endif %}

  var crto_hashed_email = "{{Hashed}}";

         if(crto_items.length > 0){

          window.criteo_q = window.criteo_q || [];
          window.criteo_q.push(
            { event: "setAccount",  account: {{accountid}} },
            { event: "setSiteType", type: /iPad/.test(navigator.userAgent)?"t":/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent)?"m":"d"},
            { event: "setEmail", email: crto_hashed_email},
            { event: "trackTransaction", id: crto_transaction_id, item: crto_items, ecpplugin: "ec-cube"}
          );
         }
</script>
<!--Criteo END-->

タグ動作テスト

[[accurate_jp]]