aishipR - タグ実装ガイド

aishipR_top

aishipRをお使いのウェブサイトには、このガイドでご紹介するタグをコピー&ペーストしていただくことで簡単にCriteoのタグが実装ができます。 また、Criteo導入にはCPPF（Criteo Performance Product Feed）と呼ばれる商品フィードも必要となりますが、これにはaishipRの管理画面から参照できるGoogle データフィードをお使いいただけます。

目次

  1. トップページタグ

  2. 商品一覧ぺージタグ

  3. 商品詳細タグ

  4. カートタグ

  5. コンバージョンタグ

  6. Google　フィードURLの取得の仕方

はじめに

aishipR管理画面で、トップ、商品一覧、商品詳細、カートの各ページタイプに設定されているレイアウト編集画面に以下のタグをコピー＆ペーストしていただくことで、タグの実装が完了します。 また、コンバージョンタグも実装可能です。詳しくはこのガイドをご覧ください。

aishipR_edit_button

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

aishipR管理画面ー＞　サイト管理ー＞　レイアウト作成ー＞　トップページに適用しているレイアウト　編集をクリック

</body>直前挿入 に以下のタグをコピー＆ペーストしてください。その際、既存のコードに影響がないよう、一番下に入れて下さい。

ペースト後、保存をクリックして下さい。

<!-- Criteo Homepage Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
crto_toppage = document.location.href.split("/")[0]+"//"+document.location.href.split("/")[2] +"/";
if(document.location.href == crto_toppage ){
    window.criteo_q = window.criteo_q || [];
    var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
    window.criteo_q.push(
        { event: "setAccount", account: {{accountid}}},
        { event: "setEmail", email: "" },
        { event: "setSiteType", type: deviceType},
        { event: "viewHome", ecpplugin: "aishipR"});
}
</script>
<!-- END Criteo Home Page Tag -->

aishipR_tag_copy_paste

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

aishipR管理画面ー＞　サイト管理ー＞　レイアウト作成ー＞　商品一覧ページに設定しているレイアウト　の編集をクリック

</body>直前挿入 に以下のタグをコピー＆ペーストしてください。その際、既存のコードに影響がないよう、一番下に入れて下さい。

ペースト後、保存をクリックして下さい。

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

var crto_list = [];
var crto_all = document.querySelectorAll("[data-item-id]");
if(crto_all.length > 0){
     for(var i= 0; i < 3; i++){
        if(typeof crto_all[i] != "undefined"){
            crto_list.push(crto_all[i].getAttribute("data-item-id"))
        }
    }
}
window.criteo_q = window.criteo_q || [];
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q.push(
 { event: "setAccount", account: {{accountid}}},
 { event: "setEmail", email: "" },
 { event: "setSiteType", type: deviceType},
 { event: "viewList", item: crto_list, ecpplugin: "aishipR" });
</script>
<!-- END Criteo Search Results Tag -->

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

aishipR管理画面ー＞　サイト管理ー＞　レイアウト作成ー＞　商品詳細ページに設定しているレイアウト　の編集をクリック

</body>直前挿入 に以下のタグをコピー＆ペーストしてください。その際、既存のコードに影響がないよう、一番下に入れて下さい。

ペースト後、保存をクリックして下さい。

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

var crto_product = document.getElementsByTagName("article")[0].getAttribute("id");
window.criteo_q = window.criteo_q || [];
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q.push(
 { event: "setAccount", account: {{accountid}}},
 { event: "setEmail", email: "" },
 { event: "setSiteType", type: deviceType},
 { event: "viewItem", item: crto_product, ecpplugin: "aishipR" });
</script>
<!-- END Criteo Product Tag -->

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

aishipR管理画面ー＞　サイト管理ー＞　レイアウト作成ー＞　カートページに設定しているレイアウト　の編集をクリック

</body>直前挿入 に以下のタグをコピー＆ペーストしてください。その際、既存のコードに影響がないよう、一番下に入れて下さい。

ペースト後、保存をクリックして下さい。


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

var crto_productid = document.getElementsByClassName("sysItemName");
var crto_price = document.querySelectorAll("[data-sub-retail-price]");
var crto_quantity = document.getElementsByName("num"); 
var crto_array = [];

for(var i =0; i<crto_productid.length; i++){
    crto_array.push(
        {id: crto_productid[i].getElementsByTagName("a")[0].getAttribute("href").split("/")[4].split("?")[0],
        price: crto_price[i].innerHTML.replace(/\D+/g,''),
        quantity:crto_quantity[i].options[crto_quantity[i].selectedIndex].value}
    );
}

window.criteo_q = window.criteo_q || [];
var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
window.criteo_q.push(
 { event: "setAccount", account: {{accountid}}},
 { event: "setEmail", email: "" },
 { event: "setSiteType", type: deviceType},
 { event: "viewBasket", item: crto_array,ecpplugin: "aishipR"  }
);
</script>
<!-- END Criteo Basket/Cart Tag -->

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

aishipR管理画面ー＞　集客管理ー＞　アフィリエイト／コンバージョン設定ー＞　新規作成をクリック。以下のように設定ください。

  • 登録名：Criteo

  • 有効／無効：有効

  • コンバージョンポイント：購入完了画面

  • 方式：ＳＣＲＩＰＴタグ方式

  • 設置タグ：bodyタグ

スニペットには以下のタグをコピー＆ペーストしてください。

その後、確認ボタン、保存ボタンを続けて押して下さい。

<!-- Criteo Sales Tag -->
<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
<script type="text/javascript">
var criteo_array = [];
var crto_transactionid = '<#受付番号>';

<#繰返始>
var crto_productid = '<#商品管理番号>';
var crto_price = <#商品単価>;
var crto_quantity = <#商品数量>
criteo_array.push({id:crto_productid, price :crto_price, quantity: crto_quantity});
<#繰返終>

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

aishipR_conversion

タグ動作テスト

[[accurate_jp]]

6・Google データフィードURLの確認の仕方

以下のページでGoogle データフィードのURLを確認できます。

サイト管理　－＞　基本設定　

aishipR_conversion