チャットボタン設定の作成方法・ボタン作成の概念をこのページで解説しています。
...
まずチャットボタン設定を開いたときに、一覧に表示されている設定を「リビジョン」と呼びます。
...
任意のリビジョンをクリックして展開すると、一覧表示される設定を「ボタン設定」と呼びます。
...
WhatYaのタグが埋め込まれているページにおいては、
設定をテスティングに反映後、御社環境のURLにこちらのパラメータ_whatya_testingを付与することで
実際の環境で正しく設定が反映されるかを確認することができます。
...
以下のように、適用先のURLにパラメーター付与すると本番に影響を与えずに表示確認が可能となります。
https://ser-solairo.sakura.ne.jp/ec-solairo/?_whatya_testing
テスト環境に適用したものに更に「本番環境に適用」を行うと本番環境に反映されます。
...
現在ご利用中のWhatYaを維持する必要があります。ご利用中のWhatYaを表示させたい場合は以下ご留意ください。
...
Note
新規リビジョン作成時にデフォルトで入っているボタン設定を削除もしくは上書きした場合、現在ご利用中のWhatYaが表示されなくなるのでご注意ください。
...
ご利用中のWhatYaを表示させたい場合は、デフォルトで入っているボタン設定を削除もしくは上書きせずに、そのまま残した状態で新しくボタン設定を追加ください。
...
| 情報 |
|---|
ボタン設定の編集 |
保存後に編集したい場合は、編集したいリビジョンを選択して「編集ボタン」をクリックすると編集する事ができます。※編集後は通常の手順同様に保存を押してください。
...
下記、サンプルCSSです。
こちらのCSSをベンダーさまにお渡しし、デザイン変更をご依頼ください。
| 注意 |
|---|
下記はあくまでもサンプルとなりますので、各企業さま毎の環境での動作の保証はできかねますことご了承ください。 |
| コード ブロック | ||
|---|---|---|
| ||
/* <ボタン → ×ボタン */
#button6 > div > div > button > span > svg > path{
d: path("M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z");
} |
...
指定したドメインを含むすべてのWebページにボタンの設定を適用する事ができます
https://ser-solairo.sakura.ne.jp
設定例
...
Path（URLのパス）
指定したWebページのパスにボタンの設定を適用する事ができます
https://ser-solairo.sakura.ne.jp/ec-solairo/cart
※正規表現が利用できます
※例えば「/ec-solairo/cart」を含む全てのパスで表示したい場合は.*/ec-solairo/cart.*と記載します。
...
指定したパラメーターを含むWebページにボタンの設定を適用する事ができます。
https://ser-solairo.sakura.ne.jp/ec-solairo/?id=cv_start2
設定例
...
https://ser-solairo.sakura.ne.jp/ec-solairo/?cv_start2
※「=」がついていないパラメーターの場合
設定例
...
複数条件を設定している場合は、すべての条件が満たされた場合か、どれかが満たされた場合かを選択してください。
...
レビュー画面でテストをするために、以下のドメイン名も条件に追加をしてください。
whatya.solairo-api.com
...
※レビュー画面とは空色が提供している、設定したチャットのプレビューが見れる画面です。
...
要素のiDで条件を設定する場合は、サイト内のスクリプトはCSSを管理しているベンダーにご相談下さい。
以下の要素が対象です。
・要素のID
・クエリ
更に以下を条件とします。
・有無
・完全一致
・数値範囲
（例）
例えばこのWebページの場合、クエリを「ec-price__price」
...