【2022年1月27日以前にタグ設置を実施されたお客様へ】
新たに、商品情報・会員フラグ・ログイン状態・通貨(ISOコード)をカスタム属性に連携したことで、より効果的な接客を実施することが出来るようになりました。
※カスタム属性を利用した接客を実施するには、新しいタグへの置き換えおよびカスタム属性の登録を行っていただく必要がございます。対応手順の詳細は、以下の【導入手順の概要】、【計測タグ・カートタグの設置】、【コンバージョンタグの設置】、【カスタム属性の登録】をご参照下さい。
【注意事項】
- 以下は、ecコンシェルの設置方法の一例となっておりますので、貴社テストサイト等での動作をご確認いただき、本番サイトに導入するようお願いいたします。
- 計測タグ、カートタグ、コンバージョンタグを同一のドメインに設置する場合のみ動作いたします。
- 動作するページ構成例
・計測タグ設置ページドメイン https://お客様のサービス名.myshopify.com
・カートページ https://お客様のサービス名.myshopify.com/cart
・購入完了ページ https://お客様のサービス名.myshopify.com/xxxxx/checkouts/xxxxx/thank_you
※ページ構成については、お手数ですが、カートASP事業者様にご確認下さいますようお願いいたします。 - 以下のページにはタグが設置されないため、当該ページでの接客はご利用いただけません。
・連絡先、配送先情報入力ページ(/xxxxx/checkouts/xxxxx?step=contact_information)
・配送方法選択ページ(/xxxxx/checkouts/xxxxx?previous_step=contact_information&step=shipping_method)
・支払いページ(/xxxxx/checkouts/xxxxx?previous_step=shipping_method&step=payment_method) - Shopifyの未公開のテーマにタグを設置する場合は、最後にテーマの公開操作が必要となります。
(1) 管理画面から [オンラインストア] > [テーマ] の順に移動します。
(2) テーマライブラリーセクションで、公開するテーマを見つけて、[アクション] > [公開する] をクリックします。
(3) 「(テーマ名)を公開する」ウィンドウで [公開する] をクリックします。
【導入手順の概要】
以下の導入手順は、大きく分けて2つの手順に分かれています。
1. タグの設置
2. カスタム属性の登録
後述の各ecコンシェルタグでは、Shopifyの商品情報・会員フラグ・ログイン状態・通貨(ISOコード)をカスタム属性に連携しており、より効果的な接客を実施いただけます。
<効果的な接客事例>
・ユーザーが興味のある閲覧商品と同じカテゴリの商品を訴求して、購入を促進する
・ユーザーの好みにあった前回購入商品と同じジャンルの限定商品を訴求して、購入を促進する
・非会員に対して会員限定キャンペーンを訴求し、新規会員獲得を促進する
カスタム属性をご利用いただくには、ecコンシェル管理画面にてカスタム属性の登録を行う必要がありますので、タグ設置と併せてご登録をお願いいたします。
【導入手順】
以下の手順を1から順に実施をお願いいたします。
・タグを設置したページでは、カスタム属性を使った接客が可能となります。詳細は後述の【カスタム属性の登録】をご参照ください。
【計測タグ・カートタグの設置】
- ログイン後に、オンラインストア を押下して下さい。
- テーマ > アクション > コードを編集 を押下して下さい。
- 以下のタグをコピーし、テキストエディタ等に貼り付けて下さい。
(このテキストをクリックすると下記コードをコピーできます)<!-- ecコンシェル計測タグ・カートタグ -->
{% if request.path == '/cart' %}
<script>
(function(w,d,url,a,s,e){
w[a]= (w[a]||[]);
s = d.getElementsByTagName("script")[0];e = d.createElement("script");e.src=url;e.async=1;s.parentNode.insertBefore(e,s);
})(window,document,'//ec-concier.com/サイト識別子/analytics.js','ara');
ara.push(['init', 'サイト識別子']);
var ecc_currency_iso_code = '{{ cart.currency.iso_code }}';
var cart_total_price_jpy = {{ cart.items_subtotal_price }};
var cart_total_price_foreign = {{ cart.items_subtotal_price }};
if(ecc_currency_iso_code == 'JPY'){
ara.push(['cart', {cartPrice:cart_total_price_jpy/100}]);
};
var ecc_cart_array = {
NAME: 0, ID: 1, PRICE: 2, GROUP: 3, TAG: 4, URL: 5
};
var ITEMS = new Array(Object.keys(ecc_cart_array).length);
for (var i = 0; i < ITEMS.length; i++) {
ITEMS[i] = [];
};
{% for item in cart.items %}
ITEMS[ecc_cart_array.NAME].push('{{item.product.title}}');
ITEMS[ecc_cart_array.ID].push('{{item.product.id}}');
ITEMS[ecc_cart_array.PRICE].push('{{item.product.price | money}}');
ITEMS[ecc_cart_array.GROUP].push('{{item.product.type}}');
ITEMS[ecc_cart_array.TAG].push('{{item.product.tags | join: '|'}}');
ITEMS[ecc_cart_array.URL].push(decodeURIComponent('{{item.product.url}}'));
{% endfor %}
for (var i = 0; i < ITEMS.length; i++) {
ITEMS[i] = ITEMS[i].filter(function(value, index, array) { return value.length >= 0 }).join(',');
};
var ecc_cart_amount = {{ cart.item_count }};
ara.push(['custom_set', 'cart_total_price_foreign_currency', cart_total_price_foreign/100]);
ara.push(['custom_set', 'cart_currency_iso_code', ecc_currency_iso_code]);
ara.push(['custom_set', 'cart_total_quantity', ecc_cart_amount]);
ara.push(['custom_set', 'cart_product_name', ITEMS[ecc_cart_array.NAME]]);
ara.push(['custom_set', 'cart_product_id', ITEMS[ecc_cart_array.ID]]);
ara.push(['custom_set', 'cart_price_including_tax', ITEMS[ecc_cart_array.PRICE]]);
ara.push(['custom_set', 'cart_category_name', ITEMS[ecc_cart_array.GROUP]]);
ara.push(['custom_set', 'cart_product_tag', ITEMS[ecc_cart_array.TAG]]);
ara.push(['custom_set', 'cart_product_url', ITEMS[ecc_cart_array.URL]]);
var member_status = '{{ customer.id }}';
function getMemberStatus(){
if(/.+/.test(member_status)){
return "1";
}else{
return "0";
};
};
var member_flag = getMemberStatus();
var login_status = '{{ customer.id }}';
function getLoginStatus(){
if(/.+/.test(login_status)){
return "1";
}else{
return "0";
};
};
var login_flag = getLoginStatus();
try{
if(member_flag == "1"){
ara.push(['custom_set', 'member_flg', member_flag]);
};
ara.push(['custom_set', 'login_flg', login_flag]);
}catch (e) {}
</script>
{% else %}
<script>
(function(w,d,url,a,s,e){
w[a]= (w[a]||[]);
s = d.getElementsByTagName("script")[0];e = d.createElement("script");e.src=url;e.async=1;s.parentNode.insertBefore(e,s);
})(window,document,'//ec-concier.com/サイト識別子/analytics.js','ara');
ara.push(['init', 'サイト識別子']);
try{
ara.push(['custom_set', 'goods_product_name', ecc_goods_name]);
ara.push(['custom_set', 'goods_system_code', ecc_goods_id]);
ara.push(['custom_set', 'goods_product_url', ecc_goods_url]);
ara.push(['custom_set', 'goods_category_name', ecc_goods_group]);
ara.push(['custom_set', 'goods_product_tag', ecc_goods_tag]);
ara.push(['custom_set', 'goods_product_collection', ecc_goods_collection]);
ara.push(['custom_set', 'goods_price_including_tax', ecc_goods_price/100]);
ara.push(['custom_set', 'goods_price_including_tax_with_currency', ecc_goods_price_with_currency]);
}catch(e){}
var member_status = '{{ customer.id }}';
function getMemberStatus(){
if(/.+/.test(member_status)){
return "1";
}else{
return "0";
};
};
var member_flag = getMemberStatus();
var login_status = '{{ customer.id }}';
function getLoginStatus(){
if(/.+/.test(login_status)){
return "1";
}else{
return "0";
};
};
var login_flag = getLoginStatus();
try{
if(member_flag == "1"){
ara.push(['custom_set', 'member_flg', member_flag]);
};
ara.push(['custom_set', 'login_flg', login_flag]);
}catch (e) {}
</script>
{% endif %}
<script>
console.log('path :', '{{request.path}}');
</script>
<!-- ecコンシェル計測タグ・カートタグ --> - 手順3のタグの説明
閲覧商品情報を連携済みの計測タグと、カート内合計金額およびカート内商品情報を連携済のカートタグを統合したタグとなります。
・{% if request.path == '/cart' %} 〜 {% else %} の間に記述されているタグがカートタグ、{% else %} 〜 {% endif %} の間に記述されているタグが計測タグとなります。
※カート内合計金額には、日本通貨での買い物時のみ金額が連携されます。
海外通貨のカート内合計金額を接客条件に利用したい場合は、カスタム属性の「カート_合計金額(海外通貨用)」にてご対応ください。
カスタム属性の利用方法は、後述の【カスタム属性の登録】をご参照ください。 - お客様のサイト識別子を確認、コピーし、手順4のタグ内の「サイト識別子」(前後の「'」(シングルクォーテーション)は含めず)と置き換えて下さい。(計4箇所)
お客様のサイト識別子の確認方法はこちらのページを参照して下さい。 - Layout > {/}theme.liquid を押下し、theme.liquidを開いて下さい。
- theme.liquidのソースコード末尾にある「</body>」タグの直前に、手順5で編集したタグを貼り付けて下さい。
- ページ右上にある「保存する」ボタンを押下して、保存して下さい。
【閲覧商品情報連携用タグの設置】
・当タグを設置することで、商品詳細ページにてカスタム属性を利用した接客が可能になります。
- Sections > {/}main-product.liquidを押下し、main-product.liquidを開いてください。
- 以下のタグをコピーし、main-product.liquidのソースコードの最下部に貼り付けてください。
(このテキストをクリックすると下記コードをコピーできます)<!-- ecコンシェル閲覧商品情報連携 -->
<script>
var ecc_goods_name = '{{product.title}}';
var ecc_goods_id = '{{product.id}}';
var ecc_goods_url = '{{product.url}}';
ecc_goods_url = decodeURIComponent(ecc_goods_url);
var ecc_goods_price = '{{product.price}}';
var ecc_goods_price_with_currency = '{{product.price | money}}';
var ecc_goods_group = '{{product.type}}';
var ecc_goods_tag = '{{product.tags | join: '|'}}';
var ecc_goods_collection = [];
{% for collection in product.collections %}
ecc_goods_collection.push('{{ collection.title }}');
{% endfor %}
ecc_goods_collection = ecc_goods_collection.filter(function(value, index, array) { return value.length >= 0 }).join('|');
</script>
<!-- /ecコンシェル閲覧商品情報連携 --> - ページ右上にある「保存する」ボタンを押下して、保存して下さい。
【コンバージョンタグの設置】
- 管理画面より、設定 > チェックアウトを押下して下さい。
- チェックアウトを押下すると、以下の様にチェックアウト設定画面に遷移します。
- 以下のタグをコピーし、テキストエディタ等に貼り付けて下さい。
(このテキストをクリックすると下記コードをコピーできます)<!-- ecコンシェルコンバージョンタグ -->
<script>
(function(w,d,url,a,s,e){
w[a]= (w[a]||[]);
s = d.getElementsByTagName("script")[0];e = d.createElement("script");e.src=url;e.async=1;s.parentNode.insertBefore(e,s);
})(window,document,'//ec-concier.com/サイト識別子/analytics.js','ara');
ara.push(['init','サイト識別子']);
var ecc_currency_iso_code = '{{ checkout.currency }}';
var purchase_total_price = {{ checkout.total_price }};
if(ecc_currency_iso_code == 'JPY'){
purchase_total_price = purchase_total_price/100;
}else{
purchase_total_price = 0;
};
ara.push(['conversion_type', {conversion_type:'goal' ,sumValue:purchase_total_price}]);
var ecc_purchase_array = {
NAME: 0, ID: 1, PRICE: 2, GROUP: 3, TAG: 4, URL: 5
};
var ITEMS = new Array(Object.keys(ecc_purchase_array).length);
for (var i = 0; i < ITEMS.length; i++) {
ITEMS[i] = [];
};
{% for item in checkout.line_items %}
ITEMS[ecc_purchase_array.NAME].push('{{item.product.title}}');
ITEMS[ecc_purchase_array.ID].push('{{item.product.id}}');
ITEMS[ecc_purchase_array.PRICE].push('{{item.product.price | money}}');
ITEMS[ecc_purchase_array.GROUP].push('{{item.product.type}}');
ITEMS[ecc_purchase_array.TAG].push('{{item.product.tags | join: '|'}}');
ITEMS[ecc_purchase_array.URL].push(decodeURIComponent('{{item.product.url}}'));
{% endfor %}
for (var i = 0; i < ITEMS.length; i++) {
ITEMS[i] = ITEMS[i].filter(function(value, index, array) { return value.length >= 0 }).join(',');
};
var purchase_total_price_foreign = {{ checkout.total_price }};
var purchase_coupon_name = [];
{% for discount_application in checkout.cart_level_discount_applications %}
purchase_coupon_name.push('{{ discount_application.title }}');
{% endfor %}
purchase_coupon_name = purchase_coupon_name.filter(function(value, index, array) { return value.length >= 0 }).join(',');
ara.push(['custom_set', 'purchase_currency_iso_code', ecc_currency_iso_code]);
ara.push(['custom_set', 'purchase_total_price_foreign_currency', purchase_total_price_foreign/100]);
ara.push(['custom_set', 'purchase_used_coupon_name', purchase_coupon_name]);
ara.push(['custom_set', 'purchase_product_name', ITEMS[ecc_purchase_array.NAME]]);
ara.push(['custom_set', 'purchase_system_code', ITEMS[ecc_purchase_array.ID]]);
ara.push(['custom_set', 'purchase_price_including_tax', ITEMS[ecc_purchase_array.PRICE]]);
ara.push(['custom_set', 'purchase_product_category', ITEMS[ecc_purchase_array.GROUP]]);
ara.push(['custom_set', 'purchase_product_tag', ITEMS[ecc_purchase_array.TAG]]);
ara.push(['custom_set', 'purchase_product_path', ITEMS[ecc_purchase_array.URL]]);
</script>
<!-- ecコンシェルコンバージョンタグ --> - 手順3のタグの説明
購入完了時の合計金額および購入商品情報を連携済のコンバージョンタグとなります。
※購入合計金額には、日本通貨での購入時のみ金額が連携されます。
海外通貨での購入を許可している場合、正しく購入金額(純増売上など)を計測いただけませんので、何卒ご了承ください。 - お客様のサイト識別子を確認、コピーし、手順4のタグ内の「サイト識別子」(前後の「'」(シングルクォーテーション)は含めず)と置き換えて下さい。(計2箇所)
お客様のサイト識別子の確認方法はこちらのページを参照して下さい。 - チェックアウト設定画面を下にスクロールし、追加スクリプト の入力欄に、手順5で編集したタグを貼り付けて下さい。
- ページ右下にある「保存する」ボタンを押下して、保存して下さい。
【タグが正常に設置されているかの確認】
- 上記のタグ設置後、導入サイトのトップページ・カートページ・購入完了ページをそれぞれ表示し、計測タグ・カートタグ・コンバージョンタグが正常に設置、動作しているか確認します。
確認方法はこちらをご参照下さい。 - ecコンシェル管理画面にログインし、タグ設置が正常に反映されているか確認します。
確認手順はこちらをご参照ください。
※過去にecコンシェルを導入済みの場合、こちらは不要の手順となります。
【カスタム属性の登録】
カスタム属性を活用した効果的な接客を実施するために、以下の1,2,3,4のカスタム属性を登録します。
登録手順は、後述の【カスタム属性の登録手順】をご参照下さい。
・カスタム属性の詳細はこちらをご参照下さい。
・カスタム属性の条件設定方法についてはこちらをご参照ください。
1. 決済手続き・購入完了以外のページでの連携項目の登録
・「会員フラグ」は一度ログインすれば、ログアウト後や再訪問時も"1"が連携されたまま(会員として判断し続ける)となります。
・カートページにて「購入へ進む」等のボタンの押下後にログインした場合、購入完了ページでは「非会員」かつ「ログアウト状態」として判断されますので、ご注意ください。
※購入完了後、トップページ等(決済関連・購入完了以外)に遷移した場合には「会員」・「ログイン状態」として判断可能です。
カスタム属性名 | カスタム属性のキー | データ種別 | 値の一例 |
---|---|---|---|
会員フラグ (コピーする) |
member_flg (コピーする) |
文字列 |
会員(ログイン経験有り)なら"1" |
ログイン状態 (コピーする) |
login_flg (コピーする) |
文字列 | ログイン状態なら"1" ログアウト状態なら"0" |
※1:非会員にのみ接客したい場合は、カスタム属性の条件を「会員フラグ が 未設定」に設定することで可能です。
2. 商品詳細ページでの連携項目の登録
・最後に閲覧した商品の情報が連携され、他ページへの遷移後や再訪問時にも接客条件に利用が可能です。
カスタム属性名 | カスタム属性のキー | データ種別 | 値の一例 |
---|---|---|---|
閲覧_商品名 (コピーする) |
goods_product_name (コピーする) |
文字列 | Tシャツ |
閲覧_商品グループ (コピーする) |
goods_category_name (コピーする) |
文字列 | トップス |
閲覧_商品タグ (コピーする) |
goods_product_tag (コピーする) |
文字列 |
涼しい|夏 |
閲覧_システム商品コード (コピーする) |
goods_system_code (コピーする) |
文字列 | 001 |
閲覧_商品コレクション名 (コピーする) |
goods_product_collection (コピーする) |
文字列 |
1万円以下|スタッフおすすめ |
閲覧_商品URL (コピーする) |
goods_product_url (コピーする) |
文字列 | /products/tシャツ |
閲覧_商品価格(税込) (コピーする) |
goods_price_including_tax (コピーする) |
数値 | 1100 |
閲覧_商品価格(税込)_通貨記号付き (コピーする) |
goods_price_including_tax_with_currency (コピーする) |
文字列 | ¥1,100 |
※2:1商品に対して情報が複数登録されている場合、「|」区切りで1つの文字列として取得・連携します。
3. カートページでの連携項目の登録
・最後に確認したカート内の商品情報が連携され、他ページへの遷移後や再訪問時にも接客条件に利用が可能です。
カスタム属性名 | カスタム属性のキー | データ種別 | 値の一例 |
---|---|---|---|
カート_商品名 (コピーする) |
cart_product_name (コピーする) |
文字列 | ジャケット,ネックレス (※3) |
カート_商品グループ (コピーする) |
cart_category_name (コピーする) |
文字列 | アクセサリー,小物 (※3) |
カート_商品タグ (コピーする) |
cart_product_tag (コピーする) |
文字列 |
コットン|夏,シルバー|プレミア |
カート_商品ID (コピーする) |
cart_product_id (コピーする) |
文字列 | 001,002 (※3) |
カート_商品URL (コピーする) |
cart_product_url (コピーする) |
文字列 | /products/デニム,/products/tシャツ (※3) |
カート_商品価格(オプション価格除く・税込) (コピーする) |
cart_price_including_tax (コピーする) |
文字列 | 1000,2000 (※3) |
カート_商品購入数量合計 (コピーする) |
cart_total_quantity (コピーする) |
数値 | 3 |
カート_通貨(ISOコード) (コピーする) |
cart_currency_iso_code (コピーする) |
文字列 | JPY USD |
カート_合計金額(海外通貨) (コピーする) |
cart_total_price_foreign_currency (コピーする) |
数値 | 9 795.25 (※5) |
※3:カートに商品が複数投入されている場合、各商品の情報をカンマ区切りで取得し、1つの文字列として値が連携されます。(カート_商品購入数量合計・カート_通貨(ISOコード)を除く)
※4:1商品に対して情報が複数登録されている場合、「|」区切りで値を取得します。
※5:「€795,25」のような金額の場合、「795.25」のように小数として値が連携されますが、接客条件には整数による条件指定のみ可能となっておりますので、ご注意ください。
<接客条件指定例>
・カート_合計金額(海外通貨) が 795 以上
・カート_合計金額(海外通貨) が 795 以下
4. 購入完了ページでの連携項目の登録
・前回購入(最後に購入)した商品の情報が連携され、他ページへの遷移後や再訪問時にも接客条件に利用が可能です。
カスタム属性名 | カスタム属性のキー | データ種別 | 値の一例 |
---|---|---|---|
購入_商品名 (コピーする) |
purchase_product_name (コピーする) |
文字列 | ポロシャツ,ハンカチ(※6) |
購入_商品カテゴリー (コピーする) |
purchase_product_category (コピーする) |
文字列 | アクセサリー,小物(※6) |
購入_商品タグ (コピーする) |
purchase_product_tag (コピーする) |
文字列 |
コットン|夏,シルバー|プレミア(※6) |
購入_システム商品コード (コピーする) |
purchase_system_code (コピーする) |
文字列 | 003,002(※6) |
購入_商品URL (コピーする) |
purchase_product_path (コピーする) |
文字列 | /products/デニム,/products/tシャツ(※6) |
購入_商品価格(税込) (コピーする) |
purchase_price_including_tax (コピーする) |
文字列 | 33000,2200(※6) |
購入_通貨(ISOコード) (コピーする) |
purchase_currency_iso_code (コピーする) |
文字列 | JPY USD |
購入_利用クーポン名 (コピーする) |
purchase_used_coupon_name (コピーする) |
文字列 | 1E0A236HA7TN,スプリングセール(※6) |
購入_合計金額(海外通貨) (コピーする) |
purchase_total_price_foreign_currency (コピーする) |
数値 | 9 795.25 (※8) |
※6:商品を複数購入した場合、各商品の情報をカンマ区切りで取得し、1つの文字列として連携されます。(購入_通貨(ISOコード)を除く)
※7:1商品に対して情報が複数登録されている場合、「|」区切りで値を取得します。
※8:「€795,25」のような金額の場合、「795.25」のように小数として値が連携されますが、接客条件には整数による条件指定のみ可能となっておりますので、ご注意ください。
<接客条件指定例>
・購入_合計金額(海外通貨) が 795 以上
・購入_合計金額(海外通貨) が 795 以下
【カスタム属性の登録手順】
上記の1,2,3,4のカスタム属性の登録をします。
- ecコンシェル管理画面左メニューの 属性データ > カスタム属性 を押下します。
- カスタム属性の設定画面 > カスタム属性の追加にて、以下のように入力します。
※上記1,2,3,4の全てのカスタム属性について、以下の手順の実施をお願いいたします。
2-1. カスタム属性名:上記表の「カスタム属性名」からコピーし、入力します。
2-2. キー:上記表の「カスタム属性のキー」からコピーし、入力します。
2-3. データ種別:上記表の「データ種別」と同じものを選択します。
2-4. 「完了する」ボタンを押下して、登録を完了します。
【カスタム属性登録後のイメージ】
商品詳細ページのカスタム属性の登録が完了した際の状態は以下となります。
【キャンペーンの登録】
カスタム属性を利用した接客条件は、キャンペーン編集画面 > だれに > カスタム属性・インポート属性によるセグメント にて設定します。
・キャンペーン設定「だれに」の登録方法はこちらをご参照ください。
・カスタム属性の条件設定方法はこちら(2−3.キャンペーン登録)をご参照下さい。
以下カスタム属性を利用した効果的な接客事例となりますので、是非ご活用下さい。
例1:閲覧商品の関連商品を訴求
閲覧した商品と同じ商品グループの商品や関連商品を訴求することで、購入を促進します。
配信条件の設定例は以下となります。
例2:リピートユーザーに同じカテゴリーの商品を訴求
前回購入商品と同じカテゴリーの限定商品を訴求し、購入を促進します。
配信条件の設定例は以下となります。
例3:非会員ユーザーの会員登録を促進
非会員(ログイン経験なしのユーザー=非会員として判断)に会員限定キャンペーンを訴求し、会員登録を促進します。
配信条件の設定例は以下となります。