外観設定
Web チャットウィンドウの外観：ブランドアセット（Logo、アバター、テクニカルサポート Logo、チャットボタンアイコン）、表示設定、ライトテーマとダークテーマの色と効果、および右側のリアルタイムプレビュー。
外観設定では、Web チャットウィンドウの見た目を設定します。タイトルバーの Logo と色、AI アシスタントのアバター、メッセージボックスの配色、ユーザーがダークモードに切り替えられるかどうかなどを指定できます。ページは左右 2 列に分かれており、左側に設定項目、右側にリアルタイムプレビューが表示されます。色を変更するたびにプレビューも更新されるため、保存前に効果を確認できます。これらの設定は Web と内部プラットフォームでのみ利用できます。LINE などのメッセージングプラットフォームのインターフェースは、各プラットフォームによって決まります。
一、使用する場面
ブランドデザイナーが会社の新しいビジュアルガイドラインを受け取り、公式サイトのカスタマーサポートウィンドウも新しいデザインに変更することになりました。Web プラットフォームの外観設定を開き、新しい Logo とマスコットのアバターをアップロードし、テーマカラーをブランドブルーに、タイトル文字色を白に変更します。さらに、AI アシスタントのメッセージボックスの背景をライトグレーに設定します。右側のプレビューに新しい配色がリアルタイムで表示されるため、タイトルバーとメッセージバブルがガイドラインに沿っていることを確認してから保存をクリックします。公式サイトのカスタマーサポートウィンドウは、ページを更新すると新しいスタイルに切り替わり、埋め込みコードを変更する必要はありません。
二、ブランドアセット
4 つの画像欄では、いずれもアップロードをクリックしてファイルを選択します。アップロード後はプレビューが表示され、削除して再度アップロードすることもできます。
Logo
ユーザーが Web Chat を起動したときに表示されるロゴ
アバター
AI アシスタントの各メッセージの横に表示されるアバター
テクニカルサポート Logo
チャットルーム下部のブランドロゴ（「テクニカルサポートロゴを表示」を有効にする必要があります）
チャットボタンアイコン
Web サイトへの埋め込み後、右下に表示されるチャットボタン。アップロードするとデフォルトのアイコンが置き換えられます
三、表示設定
チャットルームに次の要素を表示するかどうかを設定します。
AI アシスタントのアバターを表示
メッセージに AI アシスタントのアバターを表示します
AI アシスタント名を表示
メッセージに AI アシスタントの名前を表示します
テクニカルサポートロゴを表示
チャットルーム下部にテクニカルサポートのブランドロゴを表示します
四、テーマモード設定
テーマモード切り替えを有効化
テーマモード切り替えを有効化をオンにすると、ユーザーはチャットウィンドウでライトテーマとダークテーマを切り替えられます。また、設定ページにダークテーマタブが追加され、別の配色を設定できます。オフにすると、ライトテーマのみが使用されます。
色と効果
ライトテーマ（およびダークテーマ）には、それぞれ次の項目を設定できます。
テーマカラーとナビゲーションバー
テーマカラー
ボタンやリンクなどの主要な要素とタイトルバーの色
タイトル文字色
チャットルームのタイトルバーに表示される文字の色
AI アシスタントのメッセージボックス
背景色、文字色
AI の返信バブルの配色
シャドウ効果を有効化、グラデーション効果を有効化
バブルの視覚効果
ユーザーのメッセージボックス
背景色、文字色
ユーザーのメッセージバブルの配色
シャドウ効果を有効化、グラデーション効果を有効化
バブルの視覚効果
チャット背景
背景色
チャットエリア全体の背景色
五、よくある質問
Q：保存後も Web サイトのウィンドウが変わらないのはなぜですか？
ユーザーにページを再読み込みしてもらってください。外観設定はチャットページの読み込み時に反映されるため、すでに開いているウィンドウはリアルタイムでは更新されません。
Q：ダークテーマの色は別途設定する必要がありますか？
はい。テーマモード切り替えを有効化をオンにした後、ダークテーマタブに切り替えて各項目の色を設定します。変更していない項目には、システムのデフォルトのダークテーマ配色が使用されます。
最終更新
役に立ちましたか？