目次 | ||||
---|---|---|---|---|
|
...
futureshopのレイアウトパーツの表示条件にて会員情報連携を設定しています。
留意事項
futureshopの表示条件の機能を活用してログインユーザー未ログインユーザーのWhatYaタグの出し分けを行っています。以下の点をご理解の上ご利用をご検討いただけますと幸いです。
ショップテーマのレイアウト部分を触ることになりますので、作業にご不安の企業様はベンダーさまにご依頼ください。
一括での導入ができない(手作業で必要ページにタグを入れる)部分になりますので、
・トップページ
・商品一覧(商品グループ・バンドル商品・クーポン対象商品)
・商品検索結果一覧
・商品詳細
・ショッピングカートページ
・会員登録完了
・メールマガジン申込完了
・注文完了ページ
上記リストでチェックを行いながら実施をお願いします。
...
以下埋め込みタグのサンプルです。
※以下の埋め込みタグはあくまでもサンプルとなりますので、変数やScriptのサポートは出来ませんのでご了承下さい。
※全ページに表示したい場合は、共通出力へ、特定のページに表示したい場合は、指定の項目へ以下のスクリプトを入力してください。
※https://whatya.solairo-api.com/XXXX/chat.js
のXXXX部分は御社の環境へ書き換えをお願いいたします。
コード ブロック |
---|
<script> document.addEventListener("DOMContentLoaded", function () { let scriptLoaded = false; let retryCount = 0; // 再試行の回数 const maxRetries = 10; // 最大再試行回数 const retryInterval = 500; // 再試行間隔(ミリ秒) // スクリプトを読み込む関数 function loadChatScript(attributes = {}) { if (scriptLoaded) { console.log("スクリプトはすでに読み込まれています"); return; } const script = document.createElement("script"); script.src = "https://whatya.solairo-api.com/sola3XXXX/chat.js"; // 属性を動的に追加 for (const [key, value] of Object.entries(attributes)) { script.setAttribute(key, value); } script.onload = function () { console.log("スクリプトが正常に読み込まれました"); }; script.onerror = function () { console.error("スクリプトの読み込みに失敗しました: " + script.src); }; document.body.appendChild(script); scriptLoaded = true; console.log("スクリプトタグが追加されました:", script.outerHTML); } // 会員情報をチェックし、スクリプトをロードする function checkAndLoadScript() { const memberInfo = document.querySelector(".member-info"); if (!memberInfo) { console.error(".member-info が見つかりません"); return; } const memberId = memberInfo.getAttribute("data-member-id"); const lastName = memberInfo.getAttribute("data-member-lastname"); const firstName = memberInfo.getAttribute("data-member-firstname"); const nickname = memberInfo.getAttribute("data-member-nickname"); // テンプレート文字列が残っている場合は未置き換えと判定 if ( [memberId, lastName, firstName, nickname].some(value => value && value.includes("{@") ) ) { console.log("置き換えが未完了です。再試行を行います..."); if (retryCount < maxRetries) { retryCount++; setTimeout(checkAndLoadScript, retryInterval); } else { console.warn("置き換えが完了しないため、未ログイン状態として扱います"); loadChatScript(); // 未ログイン時のスクリプトを読み込み } return; } // `guest`, または`null`(文字列)、または `null` の場合は未ログインと判定 if (memberId === "guest" || memberId === "null" || memberId === null) { console.log("未ログインユーザーと判定。デフォルトスクリプトを読み込みます"); loadChatScript(); return; } // ログイン済みの場合のスクリプトを読み込み console.log("ログイン済みと判定。スクリプトを読み込みます"); loadChatScript({ "data-cs-id": memberId, "data-cs-secret": memberId`${lastName} ${firstName}`, "data-cs-user_name": `${lastName} ${firstName}`, "data-cs-nickname": nickname, }); } // MutationObserverで置き換えを監視 const observer = new MutationObserver(() => { console.log("DOM変更を検出しました"); checkAndLoadScript(); observer.disconnect(); // 1回のみ実行 }); observer.observe(document.body, { childList: true, subtree: true, }); // 初期チェック checkAndLoadScript(); }); </script> |
※"{@ member.last_name @}" "{@ member.first_name @}"が変更されるとチャット時の過去のログが参照できなくなります。
パネル | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
測定タグ側にコンバージョンタグの設置(注文完了ページ) |
...