Aura panel |
---|
summary | 推奨されない連携方法 |
---|
params | JTdCJTIyYm9keSUyMiUzQSU3QiU3RCUyQyUyMmhlYWRlciUyMiUzQSU3QiUyMmljb24lMjIlM0ElN0IlMjJzaXplJTIyJTNBNDglMkMlMjJuYW1lJTIyJTNBJTIyZmFUaW1lcyUyMiUyQyUyMmNvbG9yJTIyJTNBJTIyJTIzZmZmZmZmJTIyJTdEJTJDJTIyYmFja2dyb3VuZENvbG9yJTIyJTNBJTdCJTIyY29sb3IlMjIlM0ElMjIlMjNlYTVjNzUlMjIlN0QlN0QlMkMlMjJoZWFkbGluZSUyMiUzQSU3QiUyMmFsaWdubWVudCUyMiUzQSU3QiUyMmhvcml6b250YWwlMjIlM0ElMjJjZW50ZXIlMjIlN0QlMkMlMjJ0ZXh0JTIyJTNBJTdCJTIydGV4dCUyMiUzQSUyMiVFNiU4RSVBOCVFNSVBNSVBOCVFMyU4MSU5NSVFMyU4MiU4QyVFMyU4MSVBQSVFMyU4MSU4NCVFOSU4MCVBMyVFNiU5MCVCQSVFNiU5NiVCOSVFNiVCMyU5NSUyMiUyQyUyMmZvbnRTaXplJTIyJTNBMTglMkMlMjJjb2xvciUyMiUzQSUyMiUyMzE1MkEyOSUyMiUyQyUyMnRleHRBbGlnbiUyMiUzQSUyMmxlZnQlMjIlMkMlMjJmb250V2VpZ2h0JTIyJTNBJTIyYm9sZCUyMiU3RCU3RCUyQyUyMmJhc2UlMjIlM0ElN0IlMjJiYWNrZ3JvdW5kQ29sb3IlMjIlM0ElN0IlMjJjb2xvciUyMiUzQSUyMiUyM2ZmZmZmZiUyMiU3RCUyQyUyMmJvcmRlclJhZGl1cyUyMiUzQSU3QiUyMnJhZGl1cyUyMiUzQTQlN0QlMkMlMjJib3JkZXIlMjIlM0ElN0IlMjJ3aWR0aCUyMiUzQTElMkMlMjJjb2xvciUyMiUzQSUyMiUyM0VBNUM3NSUyMiUyQyUyMnRvcCUyMiUzQXRydWUlMkMlMjJyaWdodCUyMiUzQXRydWUlMkMlMjJib3R0b20lMjIlM0F0cnVlJTJDJTIybGVmdCUyMiUzQXRydWUlMkMlMjJzdHlsZSUyMiUzQSUyMnNvbGlkJTIyJTdEJTdEJTdE |
---|
|
本記事はfutureshopのレイアウトパーツがご活用できないお客様向けの連携方法を記載しております。 futureshopの機能を活用して、会員・非会員様へタグを出し分ける方法を推奨しておりますので、そちらの記事をご確認ください。 【futureshop コマースクリエイター】会員情報連携の設定方法 |
こちらの記事ではfutureshop コマースクリエイターにて会員情報連携の設定方法について解説します。
会員情報連携の概要については以下の記事をご参照ください。
【WhatYa】会員情報連携のトラブルシューティング
前提条件と留意事項
Aura panel |
---|
summary | 前提条件 |
---|
params | JTdCJTIyYm9keSUyMiUzQSU3QiUyMnRleHQlMjIlM0ElN0IlMjJmb250U2l6ZSUyMiUzQTE0JTJDJTIyY29sb3IlMjIlM0ElN0IlMjJsaWdodCUyMiUzQSUyMiUyMzBlMGUwZSUyMiU3RCUyQyUyMmZvbnRXZWlnaHQlMjIlM0ElMjJsaWdodGVyJTIyJTJDJTIydGV4dEFsaWduJTIyJTNBJTIybGVmdCUyMiU3RCU3RCUyQyUyMmhlYWRlciUyMiUzQSU3QiUyMmljb24lMjIlM0ElN0IlMjJuYW1lJTIyJTNBJTIyZmFJbmZvQ2lyY2xlJTIyJTJDJTIyY29sb3IlMjIlM0ElMjIlMjMyODg4RjglMjIlMkMlMjJzaXplJTIyJTNBMjYlN0QlN0QlMkMlMjJoZWFkbGluZSUyMiUzQSU3QiUyMnRleHQlMjIlM0ElN0IlMjJ0ZXh0JTIyJTNBJTIyJUU1JTg5JThEJUU2JThGJTkwJUU2JTlEJUExJUU0JUJCJUI2JTIyJTJDJTIyY29sb3IlMjIlM0ElMjIlMjMyZDJkMmQlMjIlMkMlMjJmb250U2l6ZSUyMiUzQTE4JTJDJTIyZm9udFdlaWdodCUyMiUzQSUyMmJvbGQlMjIlMkMlMjJ0ZXh0QWxpZ24lMjIlM0ElMjJsZWZ0JTIyJTdEJTdEJTJDJTIyYmFzZSUyMiUzQSU3QiUyMmJhY2tncm91bmRDb2xvciUyMiUzQSU3QiUyMmNvbG9yJTIyJTNBJTIyJTIzZmZmZmZmJTIyJTdEJTJDJTIyYm9yZGVyJTIyJTNBJTdCJTIyY29sb3IlMjIlM0ElMjIlMjMyODg4RjglMjIlMkMlMjJ3aWR0aCUyMiUzQTEwJTJDJTIydG9wJTIyJTNBZmFsc2UlMkMlMjJyaWdodCUyMiUzQWZhbHNlJTJDJTIyYm90dG9tJTIyJTNBZmFsc2UlMkMlMjJsZWZ0JTIyJTNBdHJ1ZSUyQyUyMnN0eWxlJTIyJTNBJTIyc29saWQlMjIlN0QlMkMlMjJib3JkZXJSYWRpdXMlMjIlM0ElN0IlMjJyYWRpdXMlMjIlM0E0JTdEJTJDJTIyYm94U2hhZG93JTIyJTNBJTdCJTIyc2hhZG93cyUyMiUzQSU1QiU3QiUyMmNvbG9yJTIyJTNBJTIycmdiYSgwJTJDJTIwMCUyQyUyMDAlMkMlMjAwLjA4KSUyMiUyQyUyMnglMjIlM0EwJTJDJTIyeSUyMiUzQTElMkMlMjJibHVyJTIyJTNBMSUyQyUyMnNwcmVhZCUyMiUzQTAlN0QlMkMlN0IlMjJjb2xvciUyMiUzQSUyMnJnYmEoMCUyQyUyMDAlMkMlMjAwJTJDJTIwMC4xNiklMjIlMkMlMjJ4JTIyJTNBMCUyQyUyMnklMjIlM0ExJTJDJTIyYmx1ciUyMiUzQTMlMkMlMjJzcHJlYWQlMjIlM0ExJTdEJTVEJTdEJTdEJTdE |
---|
|
futureshopの測定タグで会員情報連携を設定する場合 |
...
パネル |
---|
panelIconId | 2699 |
---|
panelIcon | :gear: |
---|
panelIconText | ⚙️ |
---|
bgColor | #B3F5FF |
---|
|
測定タグのへのタグの設定 |
futureshop管理画面のメニュー:プロモーション管理 > 測定タグ一覧で、以下を設定いただきます。
...
パネル |
---|
panelIconId | 31-20e3 |
---|
panelIcon | :one: |
---|
panelIconText | 1️⃣ |
---|
bgColor | #E6FCFF |
---|
|
注文完了ページ以外 |
注文完了ページ以外の全てのページに、埋め込みタグを設定します。
...
上記の注文完了ページ以外に、以下の設定を行ってください。
...
出力設定
<body>タグ内(<body>タグの後)に出力するを選択
出力内容
以下タグ、埋め込みタグのサンプルです。
※以下の埋め込みタグはあくまでもサンプルとなりますので、変数やScriptのサポートは出来ませんのでご了承下さい。
※6行目のXXXXの箇所はサンプルの値となりますので、御社のクライアントコートを入れてください。
...
パネル |
---|
panelIconId | 32-20e3 |
---|
panelIcon | :two: |
---|
panelIconText | 2️⃣ |
---|
bgColor | #E6FCFF |
---|
|
注文完了ページ |
注文完了ページに、以下の設定を行ってください。
...
出力設定
<body>タグ内(<body>タグの後)に出力するを選択
出力内容
以下埋め込みタグのサンプルです。
※以下の埋め込みタグはあくまでもサンプルとなりますので、変数やScriptのサポートは出来ませんのでご了承下さい。
※6行目のXXXXの箇所はサンプルの値となりますので、御社のクライアントコードを入れてください。
コード ブロック |
---|
|
<script>
document.addEventListener("DOMContentLoaded", function() {
try {
const memberid = "{@ member.id @}".trim();
const scriptTag = document.createElement('script');
scriptTag.src = "https://whatya.solairo-api.com/XXXX/chat.js";
if (memberid && memberid !== "null") {
scriptTag.setAttribute('data-cs-id', '{@ member.id @}');
scriptTag.setAttribute('data-cs-secret', '{@ member.id @}');
}
document.body.appendChild(scriptTag);
} catch (error) {
console.error("エラーが発生しました:", error.message);
}
});
</script>
<script>
window.onWhatYaReady = (whatya) => {
whatya.purchase({ price: {% analytics.purchase_price_with_options_including_tax %}, user_id: '{@ member.id @}' });
}
</script> |
...
設定は以上となります。
Aura panel |
---|
summary | 前提条件 |
---|
params | JTdCJTIyYm9keSUyMiUzQSU3QiUyMnRleHQlMjIlM0ElN0IlMjJmb250U2l6ZSUyMiUzQTE0JTJDJTIyY29sb3IlMjIlM0ElN0IlMjJsaWdodCUyMiUzQSUyMiUyMzBlMGUwZSUyMiU3RCUyQyUyMmZvbnRXZWlnaHQlMjIlM0ElMjJsaWdodGVyJTIyJTJDJTIydGV4dEFsaWduJTIyJTNBJTIybGVmdCUyMiU3RCU3RCUyQyUyMmhlYWRlciUyMiUzQSU3QiUyMmljb24lMjIlM0ElN0IlMjJuYW1lJTIyJTNBJTIyZmFJbmZvQ2lyY2xlJTIyJTJDJTIyY29sb3IlMjIlM0ElMjIlMjMyODg4RjglMjIlMkMlMjJzaXplJTIyJTNBMjYlN0QlN0QlMkMlMjJoZWFkbGluZSUyMiUzQSU3QiUyMnRleHQlMjIlM0ElN0IlMjJ0ZXh0JTIyJTNBJTIyJUU1JTg5JThEJUU2JThGJTkwJUU2JTlEJUExJUU0JUJCJUI2JTIyJTJDJTIyY29sb3IlMjIlM0ElMjIlMjMyZDJkMmQlMjIlMkMlMjJmb250U2l6ZSUyMiUzQTE4JTJDJTIyZm9udFdlaWdodCUyMiUzQSUyMmJvbGQlMjIlMkMlMjJ0ZXh0QWxpZ24lMjIlM0ElMjJsZWZ0JTIyJTdEJTdEJTJDJTIyYmFzZSUyMiUzQSU3QiUyMmJhY2tncm91bmRDb2xvciUyMiUzQSU3QiUyMmNvbG9yJTIyJTNBJTIyJTIzZmZmZmZmJTIyJTdEJTJDJTIyYm9yZGVyJTIyJTNBJTdCJTIyY29sb3IlMjIlM0ElMjIlMjMyODg4RjglMjIlMkMlMjJ3aWR0aCUyMiUzQTEwJTJDJTIydG9wJTIyJTNBZmFsc2UlMkMlMjJyaWdodCUyMiUzQWZhbHNlJTJDJTIyYm90dG9tJTIyJTNBZmFsc2UlMkMlMjJsZWZ0JTIyJTNBdHJ1ZSUyQyUyMnN0eWxlJTIyJTNBJTIyc29saWQlMjIlN0QlMkMlMjJib3JkZXJSYWRpdXMlMjIlM0ElN0IlMjJyYWRpdXMlMjIlM0E0JTdEJTJDJTIyYm94U2hhZG93JTIyJTNBJTdCJTIyc2hhZG93cyUyMiUzQSU1QiU3QiUyMmNvbG9yJTIyJTNBJTIycmdiYSgwJTJDJTIwMCUyQyUyMDAlMkMlMjAwLjA4KSUyMiUyQyUyMnglMjIlM0EwJTJDJTIyeSUyMiUzQTElMkMlMjJibHVyJTIyJTNBMSUyQyUyMnNwcmVhZCUyMiUzQTAlN0QlMkMlN0IlMjJjb2xvciUyMiUzQSUyMnJnYmEoMCUyQyUyMDAlMkMlMjAwJTJDJTIwMC4xNiklMjIlMkMlMjJ4JTIyJTNBMCUyQyUyMnklMjIlM0ExJTJDJTIyYmx1ciUyMiUzQTMlMkMlMjJzcHJlYWQlMjIlM0ExJTdEJTVEJTdEJTdEJTdE |
---|
|
futureshopのレイアウトパーツの表示条件にて会員情報連携を設定する場合 |
Aura panel |
---|
summary | 注意事項 |
---|
params | JTdCJTIyYm9keSUyMiUzQSU3QiUyMnRleHQlMjIlM0ElN0IlMjJmb250U2l6ZSUyMiUzQTE0JTJDJTIyY29sb3IlMjIlM0ElN0IlMjJsaWdodCUyMiUzQSUyMiUyMzBlMGUwZSUyMiU3RCUyQyUyMmZvbnRXZWlnaHQlMjIlM0ElMjJub3JtYWwlMjIlMkMlMjJ0ZXh0QWxpZ24lMjIlM0ElMjJsZWZ0JTIyJTdEJTdEJTJDJTIyaGVhZGVyJTIyJTNBJTdCJTIyaWNvbiUyMiUzQSU3QiUyMm5hbWUlMjIlM0ElMjJmYUV4Y2xhbWF0aW9uQ2lyY2xlJTIyJTJDJTIyY29sb3IlMjIlM0ElMjIlMjNGRkMwMjElMjIlMkMlMjJzaXplJTIyJTNBMjYlN0QlN0QlMkMlMjJoZWFkbGluZSUyMiUzQSU3QiUyMnRleHQlMjIlM0ElN0IlMjJ0ZXh0JTIyJTNBJTIyJUU2JUIzJUE4JUU2JTg0JThGJUU0JUJBJThCJUU5JUEwJTg1JTIyJTJDJTIyY29sb3IlMjIlM0ElMjIlMjMyZDJkMmQlMjIlMkMlMjJmb250U2l6ZSUyMiUzQTE4JTJDJTIyZm9udFdlaWdodCUyMiUzQSUyMmJvbGQlMjIlMkMlMjJ0ZXh0QWxpZ24lMjIlM0ElMjJsZWZ0JTIyJTdEJTdEJTJDJTIyYmFzZSUyMiUzQSU3QiUyMmJveFNoYWRvdyUyMiUzQSU3QiUyMnNoYWRvd3MlMjIlM0ElNUIlN0IlMjJjb2xvciUyMiUzQSUyMnJnYmEoMCUyQyUyMDAlMkMlMjAwJTJDJTIwMC4wOCklMjIlMkMlMjJ4JTIyJTNBMCUyQyUyMnklMjIlM0ExJTJDJTIyYmx1ciUyMiUzQTElMkMlMjJzcHJlYWQlMjIlM0EwJTdEJTJDJTdCJTIyY29sb3IlMjIlM0ElMjJyZ2JhKDAlMkMlMjAwJTJDJTIwMCUyQyUyMDAuMTYpJTIyJTJDJTIyeCUyMiUzQTAlMkMlMjJ5JTIyJTNBMSUyQyUyMmJsdXIlMjIlM0EzJTJDJTIyc3ByZWFkJTIyJTNBMSU3RCU1RCU3RCUyQyUyMmJvcmRlclJhZGl1cyUyMiUzQSU3QiUyMnJhZGl1cyUyMiUzQTQlN0QlMkMlMjJiYWNrZ3JvdW5kQ29sb3IlMjIlM0ElN0IlMjJjb2xvciUyMiUzQSUyMiUyM2ZmZmZmZiUyMiU3RCUyQyUyMmJvcmRlciUyMiUzQSU3QiUyMmNvbG9yJTIyJTNBJTIyJTIzRkZDMDIxJTIyJTJDJTIyd2lkdGglMjIlM0ExMCUyQyUyMnRvcCUyMiUzQWZhbHNlJTJDJTIycmlnaHQlMjIlM0FmYWxzZSUyQyUyMmJvdHRvbSUyMiUzQWZhbHNlJTJDJTIybGVmdCUyMiUzQXRydWUlMkMlMjJzdHlsZSUyMiUzQSUyMnNvbGlkJTIyJTdEJTdEJTdE |
---|
|
futureshopの表示条件の機能を活用してログインユーザー未ログインユーザーのWhatYaタグの出し分けを行っています。以下の点をご理解の上ご利用をご検討いただけますと幸いです。 ショップテーマのレイアウト部分を触ることになりますので、作業にご不安の企業様はベンダーさまにご依頼ください。 一括での導入ができない(手作業で必要ページにタグを入れる)部分になりますので、導入推奨リストでチェックを行いながら実施をお願いします。
|
設定方法
フリーパーツ2つ作る
→テーマ→レイアウト→埋め込みたいレイアウトを選択→レイアウトパーツを追加する
Image Removed
Image Removed
コード ブロック |
---|
<script>
window.onWhatYaReady = (whatya) => {
const onOperatorConnected = () => {
whatya.postMessage("{% page.url %}"+"からご相談です。");
}
// オペレータ接続時のイベントリスナーを登録
whatya.addEventListener('operator-connected', onOperatorConnected);
}
</script>
<script src="https://whatya.solairo-api.com/sola10/chat.js"
data-cs-id="{@ member.id @}"
data-cs-secret="{@ member.id @}"
data-cs-user_name="{@ member.last_name @}{@ member.first_name @}"
data-cs-nickname="{@ member.nickname @}">
</script> |
Image Removed
コード ブロック |
---|
<script>
window.onWhatYaReady = (whatya) => {
const onOperatorConnected = () => {
whatya.postMessage("{% page.url %}"+"からご相談です。");
}
// オペレータ接続時のイベントリスナーを登録
whatya.addEventListener('operator-connected', onOperatorConnected);
}
</script>
<script src="https://whatya.solairo-api.com/sola10/chat.js"></script> |
Image Removed
レイアウトパーツ①
...
先に作っておいた会員連携ありのフリーパーツを追加する
...
レイアウトパーツ②
...
先に作っておいた会員連携なしのフリーパーツを追加する
...
レイアウトパーツ追加①②の手順を入れたいページに行う