メインコンテンツにスキップ
すべてのコレクションApps
チャネルトークの設置方法
チャネルトークの設置方法

Apps連携機能を使ってチャットサービス「チャネルトーク」をStudioサイトに設置する手順をご紹介します。

Saika avatar
対応者:Saika
2週間以上前に更新

対象プラン: Miniプラン以上(旧プランStarterプラン以上)



Studioサイトにチャネルトークを連携する方法

この記事では、Apps連携機能を使ってチャットサービス「チャネルトーク」をStudioサイトに設置する手順をご紹介します。

チャネルトークとは

チャネルトークは、Webサイト訪問者とのコミュニケーションを円滑にするためのチャットサービスです。プログラミング不要で簡単に導入でき、多くの企業がカスタマーサポートや営業活動の効率化に活用しています。

主な特徴

  • 簡単導入:コードをコピー&ペーストするだけで設置可能。

  • 多機能性:リアルタイムチャット、顧客管理、分析機能などを搭載。

  • 幅広い業界対応:アパレルECからBtoB SaaSまで多様な業種で利用可能。

注意

  • 本手順には外部サービスの手順も含まれています。外部サービスの仕様や動作、記事内の手順以外についてはチャット窓口でのサポート対象外となる可能性があります。

  • 記事内の外部サービスの画面や仕様は2022年1月時点の情報です。記事と異なる場合、外部サービスにて最新情報をご確認ください。

設定方法

チャネルトークをStudioサイトに連携する具体的な手順をご紹介します。手順は「チャネルトーク上での設定」と「Studio上での設定」の2つのステップに分かれます。

1. チャネルトークでPlugin Keyの取得

Studioサイトにチャネルトークを埋め込むのはとっても簡単。まずチャネルトークのサイトからアカウントを作成し、チャット設置用のPlugin Keyを手に入れましょう。

  1. チャネルトーク公式サイトでアカウントを作成します。

  2. チャネルトーク管理画面(Channel Desk)の左下にある[設定]ボタンをクリックし、設定画面に移動します。

  3. 設定画面のメニューで、チャットの導入及び設定 > チャットボタンのインストールをクリックします。

  4. プラグイン名の隣にある編集ボタンをクリックしてプラグインに名前をつけます。

    使用するページやプラットフォームに合ったプラグインの名前を入力してください。入力後、新しいプラグインを作成をクリックすると、新しい導入用コードが作成されます。

    「プラグインのインストール」タブでは、WebやAndroid、iOSそれぞれに対応したコードを見ることができます。

2. StudioでApps連携

  1. Studioにログインし、プロジェクトのダッシュボードを開きます。

  2. [Apps]メニューをクリックします。

  3. [Channel]を選択し、先ほどコピーしたPlugin Keyを貼り付けて保存します。

3. 動作確認

設置したチャネルトークは、公開サイトでのみ表示されます。ライブプレビューには表示されませんので、ご注意ください。

  1. サイトを公開更新します。

  2. 公開サイトURLへアクセスし、チャットボタンが表示されているか確認します。

こちらの回答で解決しましたか?