対応ブラウザ

対応ブラウザは以下となります。

・Google Chrome (PC & mobile)
・Safari (PC & mobile)
・Firefox (PC)
・Microsoft Edge (PC)

Internet Explorerには対応していません。
※詳細はこちらをご確認下さい。
┗Internet Explorerを利用するとチャットボタンが表示されない

導入可能な環境

①以下JavaScript形式の、タグが埋め込める環境をご用意下さい。

※xxxxの部分は導入企業様ごとに異なります。

<script src="https://whatya.solairo-api.com/xxxx/chat.js"></script>

②チャットボタン、チャットウインドウのデザインは、Webサイトから、CSSタグ・CSSファイルから、WhatYaでご用意させていただいている。id / class を指定いただく事でデザインを変更できます。

③空色側のホワイトリストにドメイン許可がされていないと、タグを埋め込んでもチャットボットへ接続ができません。

ドメイン(FQDN）の許可を行う場合は、空色担当まで登録依頼をお願いします。

例：https://www.solairo.co.jp/

※ステージング環境をご利用の場合は
ステージング環境のドメインも合わせてお知らせください。

上記項目の詳細はこちらのガイドをご確認下さい。
┗ WhatYaV2デザインベンダー向け導入資料

※タグを埋め込むと、Webサイトの右下にチャットアイコンが表示されます

準備するもの

準備に必要なもの ※こちらを参照下さい。
┗ 導入企業様にご確認・ご準備いただくこと

変更可能なUI

空色担当から依頼をいただければ以下のUIを変更できます。
┗チャットウィンドウ上の文言変更可能な箇所について
┗自動OP接続機能はどんな機能か？

接客管理画面との連携

WhatYaはハイブリット専用のチャットウィンドウを利用する為、接客管理画面の機能を一部制限しています。

ハイブリッドで連携される機能の詳細はこちらをご確認下さい
┗接客管理画面(OKSKY)と連携される機能

text

テキストのみの表示

※テキストの改行：〇

image

テキスト＋画像の表示

※テキストの改行：〇

list

選択式のリストの表示

※テキストの改行：〇
　ただしリスト内テキストの改行は×

string_string_chip

選択式のボタンの表示

※テキストの改行：〇

link image slider

リンク付きの複数画像をスライド式で表示

※テキストの改行：〇

item_image_slider

複数の画像をスライド式で表示

※テキストの改行：〇

telephone

電話番号のリンクの表示

※テキストの改行：×

mail

メールアドレスのリンクの表示

※テキストの改行：×

image card

テキスト＋リンク付きの画像の表示

※テキストの改行：×
※ただしカード内のテキストの改行は〇

snackbar

Newestという機能を利用するとチャットウインドウ上部に
付箋のようなバーが表示されます。

台風やセールなど、目立たせたいお知らせなどに利用ができます。
お知らせの内容は、お客様側で随時更新が可能です。

※改行は利用するトークタイプによります

スナックバー内のテキストは改行×です。

youtube

動画（YouTube）のストリーミング再生

※テキストの改行：〇

dialog

実装予定

markdown

実装予定

LINE
（LINE Messaging API）

WhatYaとLINEを連携し、LINE上でチャットのやりとりができます。

対応メッセージタイプ：
　∟対応メッセージタイプについては下記をご参照ください。
　　LINE連携について

設定方法：
　詳細設定については、別途空色担当にご相談ください。

Facebook
（Facebook Messenger）

WhatYaとFacebook Messengerを連携し、Facebook Messenger上でチャットのやりとりができます。

対応メッセージタイプ：
　∟※準備中※

設定方法：
　∟※準備中※

導入準備

空色側で下記をご準備いたします。
・WhatYa埋め込みタグ
・プレビュー画面
・接客管理画面（有人接客がある場合）

導入企業様には下記をご準備いただきます。
・自動応対時の設定
　┗チャットボットのアイコン画像
　┗チャットボットの表示名

・有人応対時の設定
　┗オペレーターのアイコン画像
　┗オペレーターの表示名
　　┗詳細設定は下記記事をご参照ください。
　　┗導入企業様にご確認・ご準備いただくこと

・チャットを表示させたいURL

タグ埋め込み

チャットウィンドウを配置したいWebページに、タグを埋め込みを行って下さい。ただし、空色側のホワイトリストにドメイン許可がないものは、タグを埋め込んでもチャットボットへ接続ができません。

ドメインの許可を行う場合は空色担当へ登録依頼をお願いします。

登録は以下の様にFQDNをお知らせください。

例：https://www.solairo.co.jp/

※異なるドメインのステージング環境をご利用の場合は
ステージング環境のドメインも合わせてお知らせください。

タグ埋め込みの詳細については以下資料をご参照ください。
┗WhatYa_デザインベンダー向け資料

CSSによるデザイン変更

（プレビュー画面）

空色で「プレビュー画面」をご提供させていただきます。

この画面を利用してCSSのデザインテストが可能です。
左上にCSSを記載していただくと、右下の
チャットウインドウに結果が表示されます。

本番サイトへデザインを適用する前の事前テストなどに
ご利用下さい。

指定可能なid,classの詳細については以下記事をご参照ください。
┗CSSで指定可能なid,classについて

※プレビュー画面はデザイン確認のためにご活用いただく画面です。そのため「CSS適用」を押しても本番環境のチャットウィンドウにデザインは反映されないのでご注意ください。