上から2番目以降のclass属性については、表示条件として指定してもポップアップを表示させることができません
web接客の表示条件として「HTML/class属性」を設定する際に、指定したclass属性がwebサイト上に複数存在している場合、上から2番目以降のclass属性については、表示条件として指定してもポップアップを表示させることができません。
上から2番目以降のclass属性を指定するためには、貴社でclass属性の値がユニークな値になるように実装した後、b→dashでweb接客の表示条件を設定してください。以下、2つの対応が必要になります。
❶ 貴社で、class属性の値がユニークな値になるように実装する
❷ b→dashで、修正後のclass属性の値を表示条件として指定する
❶については、貴社で実装をしてください。実装イメージとしては以下です。
実装のイメージ
改修前のイメージ改修後のイメージ
以下では、「class=”item-code”」が3つあり、classの値がユニークな値になっていません。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>サンプルコード</title>
</head>
<body>
<div class="item-code">
<p>商品コード: 12345</p>
</div>
<div class="item-code">
<p>商品コード: 67890</p>
</div>
<div class="item-code">
<p>商品コード: 54321</p>
</div>
</body>
</html>
以下のように、「class=”item-code-12345″」のように、ユニークな値を設定してください。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>サンプルコード</title>
</head>
<body>
<div class="item-code-12345">
<p>商品コード: 12345</p>
</div>
<div class="item-code-67890">
<p>商品コード: 67890</p>
</div>
<div class="item-code-54321">
<p>商品コード: 54321</p>
</div>
</body>
</html>
❶の完了後、❷を実行してください。以下では、❷の操作手順を説明します。
❷ 修正後のclass属性の値を表示条件として指定する手順
「web接客」をクリックします

「web接客を配信する」をクリックします

「新規作成」をクリックします

「web」を選択し、「適用」をクリックします

「表示条件設定」をクリックします
「サイトの要素」をクリックします
「HTML/class属性」をクリックします
プルダウンから「完全一致」を選択、空白に「class属性」を入力し、「追加」をクリックします
チェックボックスをクリックします
プルダウンから「完全一致」を選択、空白に「class属性」を入力し、「追加」をクリックします
「適用」をクリックします
「OR条件」をクリックします
「HTML/class属性」をクリックします
プルダウンから「完全一致」を選択、空白に「class属性」を入力し、「追加」をクリックします
チェックボックスをクリックします

プルダウンから「完全一致」を選択、空白に「class属性」を入力し、「追加」をクリックします
「適用」をクリックします

「完了」をクリックします
