【WhatYa】チャットデザインを設定しよう

Owned by 空色　小鮒 俊太朗
Last updated: 2022/01/26 by 清水勇輔 (Unlicensed)
1 min read

WHTAYAV2


質問

チャットボタンやチャットウィンドウはどう設定すればよいでしょうか？

解決策

 

CSSでチャットボタンやチャットウィンドウのカスタマイズが可能です。
導入企業様のWebサイト上から、styleタグもしくはCSSファイルなどを利用して、直接チャットウィンドウのデザインを設定いただきます。

チャットのデザインを決めていただく場合に、空色から提供させていただいているプレビュー画面でCSSの指定結果をご確認いただけます。

プレビュー画面利用イメージ

左上のボックスにCSSを記載し「CSS適用」ボタンをクリックすると、右のチャットウインドウが指定したデザインに変化します

プレビュー画面を利用して、CSSのコードが決まりましたら、
そのコードを<style></style>タグで囲んでチャットウィンドウを表示させたいページに埋め込んで下さい。
※CSSファイルからClass、idを指定する方法でも問題ありません。

 

もう少し詳細な情報は、ベンダー向けのデザイン資料をご用意させていただいてますので、よろしければこちらもご活用下さい。

 

指定できるclass・idについては、以下の記事を参考にしてください。