futureshopコマースクリエイターを使用しているECサイトへFlipdeskの基本タグやコンバージョンタグ、その他オプションタグを設置する際は、コマースクリエイターの管理画面から設定します。
futureshopコマースクリエイター Flipdeskタグ埋め込み方法
- 基本タグの設置
- コンバージョンタグの設置 （会員情報ファイル連携の設置もこちら）
- カートタグの設置
設定で使用する箇所
コマースクリエイター ➡設定 ➡プロモーション管理 ➡測定タグ一覧 ➡測定タグを追加
▼参考画像▼
| 項目名 | 説明 |
|
利用設定 |
利用するにチェックを入れる |
| 名称設定 | 設定名に「Flipdesk」等、分かりやすい任意の名称を記入 |
共通出力：基本タグの設置
▼基本タグの設置ルールを設定します▼
| 項目名 | 説明 |
| 出力設定 | <body>タグ内（</body>タグ前）に出力する を選択します ※出力設定の4項目中、1番下のものです※ |
| 出力内容 |
出力内容部分に、Flipdeskの基本タグをそのまま入れてください ※★★★の箇所はご自身のFlipdesk管理画面内で確認し、差し替えてください。 |
基本タグにCVタグのapiタグが設置されることが増えております。
基本タグはマニュアルからではなく、必ず管理画面上でコピーし、貼り付けをお願いいたします。
基本タグとCVタグのapiタグは記載が違いますのでご注意ください。
注文完了ページ：コンバージョンタグの設置
▼コンバージョンタグの設置ルールを設定します▼
| 項目名 | 説明 |
| 出力設定 | <body>タグ内（</body>タグ前）に出力する を選択します。 ※出力設定の4項目中、1番下のものです※ |
| 出力内容 | 下方に記載しているものをコピーし貼り付けてください。 （※各クライアント様毎にご用意させて頂いておりますtid:★★★はFlipdeskの管理画面からご確認ください タグ管理＞コンバージョンタグ） |
| 情報置換文字の設定：出力内容 |
以下をコピーし貼り付けてください。 {q: {% analytics.quantity %}, sku: "{% analytics.product_no %}", t: "{% analytics.product_name %}", p: {% analytics.product.price_excluding_tax %} } |
| 情報置換文字の設定：区切り文字 | , （カンマを入れてください） |
コンバージョンタグの出力内容の記載について
★★★部分のタグIDは、各クライアント様/各タグ内容により異なります。
Flipdeskの管理画面内に記載されているものとなるので、Flipdeskの管理画面にログインしていただき、タグ管理 →コンバージョンタグより、ご確認くださいませ。
<!-- bodyタグ内に埋める -->
<script id="fd_conversion">
window.fdData = window.fdData || [];
function fdtag(){window.fdData.push(arguments);}
fdtag('track', 'conversion', {
tid: ★★★, // コンバージョンタグID(※変更しないでください)
q: '{% analytics.total_quantity %}', // 合計購買点数(※必須)
p: '{% analytics.purchase_price_including_tax %}', // 合計購買金額(※任意)
oid: '{% analytics.order_no %}', // 受注番号など、コンバージョンを識別する文字列(※任意)
// 購買した商品の内訳(※任意)
skus: [
{% analytics.item_info %}
]
});
</script>
＜会員登録をCVとして計測する場合＞
<!-- bodyタグ内に埋める -->
<script id="fd_conversion">
window.fdData = window.fdData || [];
function fdtag(){window.fdData.push(arguments);}
fdtag('track', 'conversion', {
tid: ★★★, // コンバージョンタグID(※変更しないでください)
q: 1, // 合計購買点数(※必須)
});
</script>
置き換え文字はないため、bodyの前に出力選択と、出力内容のみで完了！
カート情報取得タグ
▼コンバージョンタグの設置ルールを設定します▼
| 項目名 | 説明 |
| 出力設定 | <body>タグ内（</body>タグ前）に出力する を選択します。 ※出力設定の4項目中、1番下のものです※ |
| 出力内容 | 下方に記載しているものをコピーし貼り付けてください。 |
| 情報置換文字の設定：出力内容 |
以下をコピーし貼り付けてください。 {q: {% analytics.quantity %}, sku: "{% analytics.product_no %}", t: "{% analytics.product_name %}", p: {% analytics.product.price_excluding_tax %} } |
| 情報置換文字の設定：区切り文字 | , （カンマを入れてください） |
カートタグの出力内容の記載について
<!-- bodyタグ内に埋める -->
<script id="fd_cart">
window.fdData = window.fdData || [];
function fdtag(){window.fdData.push(arguments);}
fdtag('track', 'cart', {
skus: [
{% analytics.item_info %}
] });
</script>
会員情報連携
- 基本タグに会員情報連携用のタグを入力してください。
- 基本タグ設置がまだの場合：Flipdeskタグ埋め込み方法の手順で、Futureshop管理画面を開き、出力内容にdata-sync-user-id属性を含んだFlipdesk基本タグを入力してください。
- 基本タグ設置が済んでいる場合：Flipdeskタグ埋め込み方法の手順で、Futureshop管理画面を開き、基本タグの末尾にdata-sync-user-id属性を入力してください
data-sync-user-id属性
data-sync-user-id='{@ member.id @}'
data-sync-user-id属性が含まれたFlipdesk基本タグの例
★★★はご自身の管理画面にてご確認ください
<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='{@ member.id @}' defer></script>