ページの比較

こちらでは弊社が提供しているWhatYaのアイコンサンプルについてのページです。

...

弊社が用意しているアイコンサンプルは以下のとおりです。
御社画面でご利用いただける、URLを用意しておりますので、管理画面のURL記入欄にコピー&ペーストでご利用ください。
※極端にトラフィックの多いサイトにご利用いただくと表示されないなど、エラーが起こる可能性がございます。その場合は御社サーバーに配置していただき、アイコンを呼び出すようお願い致します。
※本アイコンを活用して起こったあらゆる事象につきましては、株式会社空色は免責とさせていただきます。あらかじめご了承の上ご活用ください。

アイコン見本	Image Modified	Image Modified	Image Modified	Image Modified	Image Modified
ファイル形式	透過PNG	透過PNG	透過PNG	透過PNG	透過PNG
URL	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_1_icon_black.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_1_icon_white.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_2_icon_black.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_2_icon_white.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_3_icon_black.png
	Image Modified	Image Modified	Image Modified	Image Modified	Image Modified
ファイル形式	透過PNG	透過PNG	透過PNG	SVG	SVG
URL	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_3_icon_white.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_4_icon_black.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_4_icon_white.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/balloon_icon_black.

svg

png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/icon_sample_shadow.svg

Image Removed

	Image Added	Image Modified	Image Modified	Image Modified	Image Modified
ファイル形式	透過PNG	SVG	透過PNG	SVG	透過PNG
URL	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_m_icon_1.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_m_icon_1.svg	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_m_icon_2.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_m_icon_2.svg	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_w_icon_1.png
	Image Modified	Image Modified	Image Modified	Image Modified	Image Modified
ファイル形式	SVG	透過PNG	SVG	透過PNG	透過PNG
URL	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_w_icon_1.svg	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_w_icon_2.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/ope_w_icon_2.svg	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/operator_icon_black.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/operator_icon_white.png
	Image Modified	Image Modified	Image Modified

Image RemovedImage Removed

Image Added
ファイル形式	透過PNG	SVG	透過PNG

SVG

透過PNG
URL	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/robot.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/robot.svg	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/robot_icon_black.png	https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/robot_icon_

black.svg

https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/robot_icon_white.png

Image Removed

ファイル形式

SVG

URL

https://ser-solairo.sakura.ne.jp/ec-solairo/html/user_data/freeimage/robot_icon_white.svg

white.png

アイコン画像の表示比率を変更したい場合、width・heightの%の値を変更ください。

...

※CSSサンプル

/* ヘッダーアイコンサイズ調整 */
#_ChatHeaderIcon img {
    width: 80%;
    height: auto;
    object-fit: cover;
    text-align: center;
}

/* ボットアイコンサイズ調整 */
._ChatWindowContent_BOT_AVATAR img {
    width: 80%;
    height: auto;
    object-fit: cover;
    text-align: center;
}