ご利用ガイド

thumbnail

チャットボタンの設定

大切なサイトにチャネルトークのボタンが自然に溶け込むように位置を修正したり、カスタムボタンでブランドの個性を表現できます。

マルチプラグインを設定して、セキュリティを強化できます。または、マルチプラグインを通して各ページごとに異なるボタンを表示させることも可能です。ボタンリストで表示させたいチャットボタンを選択し、各ボタン別に設定を行なってください。

  • [基本ボタン] で設定したプラグインが、チャット画面のURLやワークフローで使用される基本のプラグインになります。

  • 同じ顧客データで管理している複数のサイトがある場合は、マルチプラグインを活用してください。

  • プラグイン別にプラグインキーを活用して、それぞれの違うサイトや違うページに設置してください。

チャットボタンのプラグインキーまたはインストールスクリプトを確認できます。詳しい設置方法はこちらをご確認ください。

  • チャネルトークの基本のチャットボタンを19種類の多様なアイコンに変更できます。お好みのボタンデザインを選んでカラーも自由に設定できます。

  • ボタンの背景色はチャネルのテーマの色に準じます。背景色が暗いほどアイコンは白っぽくなり、背景色が明るいと暗めになります。

ブランドの雰囲気を伝える画像にボタンを変更したい場合は、画像をアップロードしてカスタマイズすることができます。設定方法と活用例をご覧ください。

  • アップロード可能な拡張子:png・ jpg・ gif

  • 画像の推奨サイズは最小180x180px、1:1の比率でアップロードできます。

  • デスクトップボタンは56px、モバイルウェブボタンは44pxのサイズで自動で調整されます。

  • デスクトップボタンとモバイルウェブボタンは同じ画像が適用されます。

  • 背景のないpngファイルの場合、バックグラウンドに背景色が適用されます。

  • モバイルネイティブSDKの場合、別途コーディングによるカスタマイズが必要です。

既存の1:1の比率ではない画像をカスタムボタンとして利用中の場合、そのまま維持することができます。ただし、新しい画像をアップロードする際には1:1比率のサイズでのみ登録ができます。変更後は以前の画像に戻すことができません。

活用イメージ

チャネルトークの基本のチャットボタンを使わずにボタンをカスタマイズしたいが、どのように設定すればいいか分からない場合は、こちらの活用イメージをご参考ください。

顧客がサイトに初めて訪問した際に、チャットで問い合わせができることを知らせる横長のボタンのことを指します。

  • 拡大型ボタンは4〜30字まで設定できます。

  • 初めてのセッションで1回表示され、以降は基本のボタンが表示されます。

  • スタッフのプロフィールがオンになっている場合、チャネルに参加している全てのスタッフのうち、オペレーターシートがオンになっていて、接客チャット統計のオペレーター別統計のスコアが高いスタッフが2人表示されます。

スタッフのプロフィールは、PCでのみ表示されます。

基本の営業時間のみ設定されている場合

営業時間が2つ以上の場合

  • 営業時間及び応答までの速度とは関係なしに表示され、[チャットをはじめる] の文言が表示されます。

  • 顧客がサイトを訪問してチャネルトークのチャットボタンを押した後に表示される、ラウンジ(チャットリスト) 画面のテーマを設定できます。

  • [ライト]、[ダーク]、[システム] モードで適用でき、システムモードに設定しておくと、お客様のシステム(ブラウザ)設定に従います。

  • 自社で開発したサイトの場合、APIを活用してデスクの設定より優先的に適用されるテーマを指定できます。

PCでサイトを訪れた際に表示されるチャットボタンを設置できます。

  • 方法:[チャネル設定] - [基本設定ボタンの設置・設定] - [チャットボタンの設定] - [デスクトップ]

オプション

説明

ボタンを非表示にする

PCウェブサイトでチャネルトークのボタンを非表示にすることができます。

位置

サイトの左側 / 右側にボタンが位置するように設定できます。

位置の調節

上下 / 縦横に、一定の範囲内で位置調整が可能です。

モバイルウェブでサイトを訪問した際に表示されるチャットボタンを設定できます。

  • 方法:[チャネル設定] - [基本設定ボタンの設置・設定] - [チャットボタンの設定] - [モバイルウェブ]

オプション

説明

モバイル設定

モバイルウェブでチャットボタンを隠すことができます。

位置

サイトの左側 / 右側にボタンが位置するように設定できます。

位置調節

上下 / 縦横に、一定の範囲内で位置調整が可能です。

拡大型ボタンの位置

拡大型ボタン、プッシュ通知やマーケティングメッセージの位置を設定できます。

特定のページにのみチャットボタンを表示させたい場合は、 ホワイトリストを設定してください。ホワイトリストに、チャットボタンを表示させたいドメインを入力すれば、該当のドメインでのみボタンが表示されます。

  • ドメインの入力時、httpまたはhttpsを除いた残りのアドレスを入力してください。

入力した文字列が含まれた全てのドメインに適用されます。適用させたいページが多い場合は、共通して含まれている文字列のみ入力すれば、一度に複数のページに適用させることができます。

PC上でチャットボタンが表示されません。

  1. [チャネル設置] - [問い合わせ] - [営業時間] - [営業時間外の運営設定] - [チャットボタンを非表示] に設定されていると、営業時間外にチャットボタンが表示されなくなります。

  2. [チャネル設置] - [基本設定] - [ボタンの設置・設定] - [オプション設定] のホワイトリストが設定されているかご確認ください。ホワイトリストに追加したURLでのみ、チャットボタンが表示されます。

モバイル上でチャットボタンが表示されません。

[基本設定] - [ボタンの設置・設定] - [モバイルウェブ] - [モバイル設定] - [モバイルでボタンを隠す] がチェックされていないか確認してください。

サイトにログインした時に、チャネルトークのボタンが見えません。

[チャネル設定] - [セキュリティ・開発] - [セキュリティ設定] - [メンバーハッシュ機能] が設定されているか、ご確認ください。この設定は、Cafe24・WordPress・MakeShop以外のビルダー社では設定できません。

拡大型ボタンが表示されたままになりません。

拡大型ボタンは顧客が初めてサイトに訪問した際に、チャットがあることを認知させるものです。

そのため以下のように動作します。

  • 顧客が初めてサイトに訪問すると拡大型ボタンが表示されます。

  • 拡大型ボタンが表示された10秒後に顧客がスクロールしたり、サイトの更新やページの移動をすると基本のチャットボタンが表示されます。

  • 拡大型ボタンを閉じたり、拡大型ボタンをクリックする場合も基本のチャットボタンが表示されるようになります。

  • 顧客がブラウザーを閉じてから再度ブラウザーを開くと拡大型ボタンが表示されます。(この時ブラウザーにクッキーが残っている場合は、再度ブラウザーを開いた時に拡大型ボタンは表示されません。他のブラウザーや他のデバイスから再度サイトに訪問する際に拡大型ボタンが表示されます。)

チャネルトークは企業と顧客のコミュニケーションの課題を解決するためのツールです。そのため顧客の体験を高めるためにサイトに溶け込むようなUIを目指して、デザインをしています。

サイトの邪魔をせず、顧客のサイトの利用体験を損なわないために、拡大型ボタンは顧客がクリックやスクロールしたり、ページの移動をした際に基本のチャットボタンが表示されるようになっています。

拡大型ボタンを設定しましたが表示されません。

拡大型ボタンは基本のチャットボタンを利用している場合やボタンのデザインをアイコンまたはカスタムして設定した場合に利用できます。ただし、営業時間が不在中であったり、運営中の状態でも応答までの時間が遅い場合は拡大型ボタンが表示されません。

次のような場合も拡大型ボタンは表示されません。

  • モバイルネイティブSDKの場合

  • CSSにてボタンのカスタマイズをしている場合

  • アップデート前のバージョンでボタンをカスタマイズして利用している場合