ecforceを使用しているECサイトにFlipdeskのタグを設置する手順を説明します。
ecforceを使用しているECサイトに、Flipdeskの基本タグやコンバージョンタグ、その他オプションタグを設置する際は、ecforceの管理画面から設定していきます。
1. 基本タグの設置
- 「ショップ管理 ＞ 各種設定 ＞ タグ管理」で「新規作成」をクリックし、基本タグの設定をする
項目名 説明 タグ名 「Flipdesk基本タグ」など、分かりやすい任意の名称を入力 タグ表示箇所 body要素の最後に追加 説明 空欄のまま タグコード 貴社専用の基本タグが管理画面にありますので、コピーの上貼り付けてください。
基本タグについては、基本タグの仕様のマニュアルをご確認ください。
- 「ショップ管理 ＞ 各種設定 ＞ ショップタグ設定」を開き、「すべての画面」にて[1]で作成したタグを選択して保存する
2. コンバージョンタグの設置
- 「ショップ管理 ＞ 各種設定 ＞ タグ管理」で「新規作成」をクリックし、コンバージョンタグを設定する
項目名 説明 タグ名 「FlipdeskCVタグ」など、分かりやすい任意の名称を入力 タグ表示箇所 body 説明 空欄のまま 出力タグ 下記のコンバージョンタグをコピーし貼り付けてください。
tid: ☆☆☆☆;の「☆」の部分はコンバージョンタグごとにIDが異なります。
管理画面よりタグIDをコピーし、必ず置き換えてください。<!-- body内に埋める -->
<script id="fd_conversion">
window.fdData = window.fdData || [];
function fdtag(){window.fdData.push(arguments);}
fdtag('track', 'conversion', {
// コンバージョンタグID(※変更しないでください)
tid: ☆☆☆☆,
q: ' {{ order_item.quantity }}',
p: ' {{ order_item.price | times: order_item.quantity }}',
oid: '{{ order.number }}',
skus: [{% for order_item in order.order_items %}
{
q: ' {{ order_item.quantity }}' ,
sku: '{{ order_item.product.number }}',
t: ' {{ order_item.name_with_tax }}{% if order_item.variant.option_values_presentation %} ({{ order_item.variant.option_values_presentation }}){% endif %} ',
p: '{{ order_item.price }}',
c: '1'
},
{% endfor %}
]
});
</script>コンバージョンタグについては、コンバージョンタグの仕様のマニュアルをご確認ください。
- 「ショップ管理 ＞ 各種設定 ＞ ショップページタグ設定」を開き、「ショップ購入（完了）」 にて[1]で作成したタグを選択して保存する
3. カートタグの設置
- 「ショップ管理 ＞ 各種設定 ＞ タグ管理」で「新規作成」をクリックし、カートタグの設置を設定する
項目名 説明 タグ名 「Flipdeskカートタグ」など、分かりやすい任意の名称を入力 タグ表示箇所 body 説明 空欄のまま 出力タグ 下記のコンバージョンタグをコピーし貼り付けてください。
<!-- body内に埋める -->
<script id="fd_cart">
window.fdData = window.fdData || [];
function fdtag(){window.fdData.push(arguments);}
fdtag('track', 'cart', {
'skus': [{% for order_item in order.order_items %}
{
q: '{{ order_item.quantity }}',
sku: '{{ order_item.product.number }}',
t: '{{ order_item.name_with_tax }}{% if order_item.variant.option_values_presentation %} ({{ order_item.variant.option_values_presentation }}){% endif %}',
p: '{{ order_item.price }}',
c: '1'
},
{% endfor %}
]
});
</script> - 「ショップ管理 ＞ 各種設定 ＞ ショップページタグ設定」を開き、「カート 」 にて[1]で作成したタグを選択して保存する
4. 会員情報連携（ファイル連携）の手順
オプション「会員情報連携」の契約が必要です。
基本タグに会員情報連携用のdata-sync-user-idの属性を追加します。api_token=★★★★★の「★」部分は貴社専用のトークンが入ります。
▼ 設定例
<script language="javascript" charset="UTF-8" type="text/javascript" src="https://api.flipdesk.jp/chat_clients/flipdesk_chat.js?api_token=★★★★★&enc=UNICODE" data-sync-user-id="{{ order.customer.number }}" defer></script>