Webサイト埋め込み・LINE公式アカウント連携の具体的ステップ
既存WebサイトへのSocratesチャットタグの設置方法から、LINE公式アカウントへのURL誘導でAIを動かす基本ステップまでを解説します。技術知識がなくても迷わず進められる手順書として活用してください。
高性能な AI も、お客様の目に触れなければ宝の持ち腐れです。設置の手間が少ないほど、導入後の改善に集中できます。
Socrates（ソクラテス）は、既存の Web サイトや LINE 公式アカウントに対し、数ステップの作業でシームレスに統合できます。
この記事では、Web サイトへの埋め込みと LINE 公式アカウントとの連携、それぞれの具体的な手順と選び方を解説します。エンジニアに依頼する前に読んでおくと、作業範囲の見積もりに役立ちます。
1. Web サイトへの埋め込み：2 種類の方法
ウィジェット設置（最も一般的）
管理画面から発行される「埋め込みタグ」を HTML の <body> 終了タグの直前に貼り付けるだけです。サイトの隅にチャットアイコンが表示され、クリックするとチャット画面が開きます。エンジニア経験がなくても、WordPress や Squarespace などの CMS であれば「カスタム HTML」エリアに貼り付けるだけで完了します。
設置後は管理画面の「許可ドメイン」に自社サイトのドメインを登録します。これにより、タグが流出しても他サイトでは動作しないセキュアな運用ができます。
インライン埋め込み（特定ページに常時表示）
FAQ ページや商品ページのコンテンツの一部として、チャット画面を常時表示させる方法です。ポップアップではなくページに溶け込んだ形でチャットが表示されるため、積極的に使ってほしいページに最適です。
ウィジェットとインラインは同じ埋め込みタグで切り替えられます。どちらの表示形式にするかは管理画面の設定で選択します。
2. LINE 公式アカウントとの連携：2 つのアプローチ
LINE と Socrates を連携させる方法は大きく 2 つあります。目的と技術的な準備状況に応じて選択します。
Messaging API 連携（直接対話）
お客様が LINE のトーク画面で送ったメッセージに、AI がその場で返信します。アプリを切り替えることなく LINE 内で接客が完結する最もシームレスな連携方式です。LINE Developers での設定が必要です。
専用 URL への誘導（ノーコード）
リッチメニューやボタンから Socrates 専用のチャットページへ誘導します。LINE Developers の設定不要でスタートできるため、まず試してみたい場合の入り口として最適です。
Messaging API 連携の流れ
Messaging API 連携は少し手順が増えますが、ユーザー体験は大幅に向上します。大まかな流れは以下の通りです。
- 1. LINE Official Account Manager で Messaging API を有効化
「設定 > Messaging API」から API 利用を開始します。 - 2. LINE Developers でキーを取得
チャネルシークレットとチャネルアクセストークン（長期）を発行・コピーします。 - 3. Socrates 管理画面に入力
「基本設定」に取得したキーを貼り付けると Webhook URL が発行されます。 - 4. LINE 側に Webhook URL を設定
LINE Developers の Webhook 設定欄に URL を貼り付けて保存します。 - 5. 応答設定を「手動チャット」に変更
LINE の自動応答をオフにすることで、Socrates の AI だけが返信するようになります。
詳細な手順はLINE Messaging API 連携マニュアルを参照してください。
3. どちらを選ぶか：判断フロー
- 今すぐ試したい・ノーコードで始めたい
→ 専用 URL への誘導から始める。リッチメニューに URL を設定するだけでスタートできます。 - LINE トーク画面で完結させたい・本格運用
→ Messaging API 連携。設定に 30 分〜1 時間程度かかりますが、ユーザー体験が大幅に向上します。 - Web サイトと LINE 両方で使いたい
→ 両方設定可能です。同じナレッジ・AI 指示文が Web と LINE で共有されるため、設定は 1 回で済みます。
よくある質問
Q1. 埋め込みタグを設置するのにエンジニアが必要ですか？
HTML 編集ができれば不要です。WordPress なら「カスタム HTML」ブロック、Squarespace なら「コードブロック」に貼り付けるだけです。エンジニアに依頼が必要なのは、JavaScript によるカスタム動作を実装する場合などです。
Q2. 複数のページに設置できますか？
はい。同じ埋め込みタグを複数ページに設置できます。許可ドメインに自社ドメインを登録しておけば、同ドメイン内の全ページで動作します。
Q3. LINE 連携後、既存の自動応答はどうなりますか？
Messaging API 連携時は、LINE の「応答設定」を「手動チャット」に変更する必要があります。これにより既存の自動応答がオフになり、Socrates の AI だけが返信するようになります。
Q4. Web と LINE で異なる AI 設定にできますか？
同一テナント内では同じ AI 設定が適用されます。Web 用と LINE 用で設定を分けたい場合は、テナントを別に作成する運用になります。
Q5. Messaging API の設定途中でつまずいたら？
詳細な手順と注意点はLINE Messaging API 連携マニュアルにまとめています。特にステップ 4（応答設定）の変更を忘れると AI が返信しないため、必ず確認してください。
コピー & ペーストで今日から始めることも、Messaging API で深く作り込むことも自在です。
あなたのサービスの成長フェーズに合わせて、最適な導入方法を選択してください。
導入前に決めておきたいこと
WebサイトとLINEのどちらにAI接客を置くかは、技術方式ではなく、お客様が相談を始める場所と有人対応へ渡す場所で決めます。
まずWebサイトではウィジェットで質問を受け、LINEでは専用URLから相談を始めてもらう構成にすると、開発作業を増やさずに入口を比較できます。 重要なのは、機能を有効にすることではなく、誰がどの情報を更新し、どの相談を人へ渡すかを運用として決めることです。
最初に整理するチェック項目
- ✅ AIに任せる相談と、担当者が判断する相談を分ける
- ✅ 回答の根拠になる情報と、その更新担当を決める
- ✅ お客様が次に取る行動を、各会話の最後に一つ用意する
- ✅ 誤回答・未解決・有人引き継ぎを確認する方法を決める
小さく始める実装手順
最初からすべてのケースを自動化する必要はありません。対象を絞り、設定した内容が実際の会話で機能するかを確認してから範囲を広げます。
- 1. 相談が発生するページと、AIに任せる質問を3つに絞る
実際の設定では、担当者が判断できる言葉に置き換え、設定後にテスト質問で確認します。 - 2. ウィジェットかインラインかをページの目的で選ぶ
実際の設定では、担当者が判断できる言葉に置き換え、設定後にテスト質問で確認します。 - 3. LINEは専用URLから始め、必要性が確認できた段階でMessaging APIへ進む
実際の設定では、担当者が判断できる言葉に置き換え、設定後にテスト質問で確認します。 - 4. テスト用の質問を用意し、AI回答・有人引き継ぎ・リンク遷移を確認する
実際の設定では、担当者が判断できる言葉に置き換え、設定後にテスト質問で確認します。
テストでは、理想的な質問だけでなく、情報が足りない質問・言い換え・複数の要望が混ざった質問も使います。回答できない場合に、無理に答えず確認質問や有人対応へ切り替えられることまでが導入の完了条件です。
運用で見るべき指標
記事のテーマに関係する成果だけでなく、会話の品質も一緒に確認します。最低限、会話数、目的の回答まで進んだ割合、未解決になった質問、有人引き継ぎの件数を同じ期間で見てください。
数字が悪いときは、いきなりAIの性格やプロンプト全体を変えず、どの質問・どの案内・どのリンクで止まったかを一つずつ確認します。原因が情報不足ならナレッジを、導線の問題なら質問順序を、判断が必要な相談なら引き継ぎ条件を修正します。
失敗しやすいパターンと直し方
埋め込みタグを貼っただけで導入完了と考えると、許可ドメインやLINEの応答設定が抜けます。設置後は実際のスマートフォンで会話を始め、AIが答えられない場合の案内まで確認してください。
もう一つの失敗は、設定した人だけが内容を理解し、現場の担当者が修正できない状態です。変更した理由・対象範囲・確認したテスト質問を短く記録し、更新担当が同じ手順で見直せるようにします。
反対に、すべてを有人対応へ戻す必要もありません。AIが安定して答えられる範囲を残し、判断が必要な境界だけを人へ渡すことで、品質と効率の両方を調整できます。
よくある質問
Q1. 最初からすべての問い合わせをAIに任せるべきですか？
いいえ。頻度が高く、回答の根拠が明確な相談から始めます。個別判断や契約に関わる相談は、必要な確認事項を示して担当者へ引き継ぐ設計が安全です。
Q2. 設定を変更したら、何を確認すればよいですか？
代表的な質問、情報が不足した質問、回答できない質問の3種類でテストします。回答内容だけでなく、次のリンクや有人対応への切り替えが意図どおりかも確認してください。
Q3. 既存のナレッジはそのまま使えますか？
そのまま登録するのではなく、古い情報・重複・条件付きの説明を整理してから使います。回答の正本と更新担当を決めておくと、後から修正しやすくなります。
Q4. AIで対応できない相談はどうすればよいですか？
対応できないことを明確に伝え、担当者へ渡すために必要な情報と相談方法を案内します。曖昧な回答を続けるより、引き継ぎ条件を明示する方が信頼を保ちやすくなります。
関連ガイド
- LINE Messaging API連携マニュアル：今回のテーマと一緒に確認しておきたい関連ガイドです。
- LINE公式アカウント活用術：今回のテーマと一緒に確認しておきたい関連ガイドです。
- パブリックモードの設定：今回のテーマと一緒に確認しておきたい関連ガイドです。
判断に迷ったときの優先順位
運用中に「AIで答えるか、人へ渡すか」を迷った場合は、まず安全性と正確性を確認し、次にお客様が今必要としている情報を考え、最後に自動化による効率を検討します。効率を優先して誤案内を残すと、後から修正するコストが大きくなるためです。
- 事実確認が必要な内容や個別判断は、根拠を確認できなければ担当者へ渡す
- 回答できる内容でも、条件によって結論が変わる場合は確認質問を先に置く
- 同じ質問が繰り返される場合は、回答を増やす前にナレッジの正本を見直す
- 成果が下がったときは、会話数だけでなく未解決と離脱の位置を確認する
担当者へ引き継ぐ情報テンプレート
有人対応へ渡すときは、会話全文をそのまま送るのではなく、次の情報を短く整理すると担当者がすぐ対応できます。項目は業務に合わせて減らして構いませんが、何を相談し、どこまで確認し、次に何を望んでいるかは残します。
- 相談の目的：お客様が解決したいこと
- 現在の状況：利用中のサービス、検討段階、発生している問題
- 確認済みの情報：AIが案内した内容と、お客様の回答
- 未確認の事項：担当者が追加で確認する必要がある点
- 次の希望：電話、メール、予約、資料送付などの希望する連絡方法
公開後7日間の見直し
公開直後は、成果が出たかだけでなく、想定外の質問がどこで発生したかを確認します。1日目は自分で代表質問を試し、3日目は未解決ログを分類し、7日目に回答・導線・引き継ぎ条件のいずれを直すかを決めます。変更した箇所とテスト結果を記録しておけば、次の更新で同じ原因を調べ直さずに済みます。
- 代表質問と境界ケースを実際の画面で確認する
- 未解決・離脱・有人引き継ぎの会話を原因別に分ける
- 最も影響の大きい1箇所だけを修正する
- 修正前と同じ質問で再テストする
- 変更日・変更理由・確認者を運用記録に残す
導入判断のための確認質問
WebサイトとLINEのどちらにAI接客を置くかは、技術方式ではなく、お客様が相談を始める場所と有人対応へ渡す場所で決めます。この方針を実際の業務へ取り入れるか判断するときは、機能の多さではなく、今ある問い合わせのどこを改善したいのかを先に確認します。目的が曖昧なまま設定を増やすと、導入後に成果を測れず、回答の修正も場当たり的になりやすいためです。
担当者間で合意しておく質問
- この仕組みで、最初に減らしたい作業や解消したい不安は何か
- お客様が自分で解決できる範囲と、専門家の判断が必要な範囲はどこか
- 回答の正しさを確認できる資料や画面はどれか
- 情報が古くなったとき、誰が、どの頻度で更新するか
- AIから担当者へ渡すとき、担当者が最初に知るべき情報は何か
- 公開後に改善の優先順位を決める人は誰か
現場で使う運用メモ
設定を公開した後は、回答の内容だけでなく、その回答がどのページや会話の入口から始まったかも記録します。同じ質問でも、初回訪問者と既存のお客様では必要な説明が変わることがあります。入口、質問、回答、次の行動を一組で残すと、どの部分を直すべきかをチームで共有しやすくなります。
また、改善のために個人情報を必要以上に保存しないことも重要です。分析に必要な項目だけを定め、閲覧できる担当者と保管期間を決めます。不要な情報を集めない設計は、運用負担を下げるだけでなく、お客様へ説明するときの分かりやすさにもつながります。
更新時には「何を変えたか」だけでなく、「なぜ変えたか」「どの質問で確認したか」「変更後に何を観察するか」を短く残します。将来、数値が変化したときに原因を追跡でき、別の担当者へ引き継ぐ場合も判断の背景が失われません。
改善前後を比べる方法
改善の効果を確認するときは、変更前と変更後で対象期間や質問の条件をそろえます。会話数が違うだけで良し悪しを判断せず、目的の回答へ進んだ割合、未解決になった割合、担当者へ渡った割合を同じ単位で比較してください。短期間の結果だけで結論を出さず、想定外の質問が増えていないかも確認します。
- 改善したい会話の種類と、観察する期間を決める
- 変更前の代表的な質問と指標を記録する
- 一度に変更する要素を一つに絞る
- 変更後に同じ質問と境界ケースで確認する
- 結果と次の仮説を記録し、次回の改善につなげる
数字が上がっても、回答の分かりにくさや引き継ぎの遅れが増えていれば、品質が改善したとはいえません。お客様が次の行動へ進めたか、担当者が状況を理解して対応できたかまでを確認して、記事で紹介する手順を自社の運用へ合わせて調整してください。