Studio Help

Apps連携：チャネルトークを連携する

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

今週アップデートされました

対象プラン：有料プラン

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

注意：

本手順には外部サービスの手順も含まれています。外部サービスの仕様や動作、記事内の手順以外についてはチャット窓口でのサポート対象外となる可能性があります。
記事内の外部サービスの画面や仕様は2022年1月時点の情報です。記事と異なる場合、外部サービスにて最新情報をご確認ください。

チャネルトークを連携する手順

手順1. チャネルトークで Plugin Key を取得する

まず、チャネルトーク上でチャット設置用の Plugin Key を取得します。

チャネルトーク公式サイトでアカウントを作成し、管理画面（Channel Desk）にログインします。
管理画面の左下にある［設定］ボタンをクリックし、設定画面に移動します。
設定画面のメニューから「チャットの導入及び設定」＞「チャットボタンのインストール」をクリックします。
プラグイン名の隣にある編集ボタンをクリックし、プラグインに分かりやすい名前を付けます。
使用するページやプラットフォームに合ったプラグイン名を入力し、「新しいプラグインを作成」をクリックします。新しい導入用コードが作成されます。
「プラグインのインストール」タブで表示されるWeb用コードの中から、Plugin Key を確認・コピーします。
WebやAndroid、iOSそれぞれに対応したコードを取得してください。

2. StudioでApps連携をする

Studioにログインし、対象プロジェクトのダッシュボードを開きます。
左メニューの［Apps］をクリックします。
[Channel Talk]のカードで、右端の[＋]をクリックします。
編集モーダルが開いたら、［Plugin Key］の入力欄に、チャネルトークでコピーした Plugin Key を貼り付けて保存します。

手順3. 動作確認

注意：チャネルトークのチャットボタンは、公開サイトにのみ表示されます。ライブプレビューには表示されません。

サイトを公開または更新します。
公開サイトのURLにアクセスし、画面下部にチャネルトークのチャットボタンが表示されているか確認します。

チャネルトーク連携を解除する手順

Studioにログインします。
連携を解除したいプロジェクトの、[ホーム]ダッシュボードを開きます。
左メニューの[Apps]を選択します。
[連携済み]にある[Channel Talk]のカードで、右端の[…]をクリックし、[連携を解除]を選びます。
解除すると、Apps連携したデータベース上のレコードだけでなく、公開サイトのHTMLからも値が削除されます。

関連記事