WebSiteChat.ai

WebsiteChat導入ガイド｜WebサイトにAIチャットを設置する方法

WebsiteChatは、公開されているWebサイトをクロールして内容を取り込み、その情報をもとに訪問者の質問へ回答するAIチャットボットです。

導入の基本的な流れは、利用しているCMSやWebサイト作成サービスにかかわらず同じです。

WordPress、Wix、Studio、Shopifyなどで違うのは、最後にWidgetコードをどこへ設置するかという点です。

Getting Started

WebsiteChatをWebサイトに導入する方法

動画で全体の流れを確認したい方は、まずこちらをご覧ください。その下では、各ステップを文字でも詳しく説明します。

導入の全体像

01

WebsiteChatにログイン

02

Webサイトを登録

03

Webサイトをクロール

04

チャットボットを設定

05

コンソールで回答をテスト

06

Widgetコードを取得

07

Webサイトに設置

08

公開サイトで動作確認

サイト登録 → クロール → AI設定 → テスト → Widget設置 → 公開

1. WebsiteChatにログイン

WebsiteChatにログインし、コンソールを開きます。すでにサイトがある場合は「サイト」から対象を選びます。新規の場合は、次の手順でサイトを追加します。

2. Webサイトを登録する

左メニューの「サイト」で、公開中のWebサイトURLを入力します。訪問者が実際に見る正規の公開URLを使います。WebsiteChatはこのURLを起点にクロールします。

WordPressやWix向けの別クローラーはありません。公開されているHTMLを読みます。

3. Webサイトをクロールする

登録後、WebsiteChatは公開ページをたどり、チャット回答に使う知識を用意します。サイトが小さければ短時間で終わることもあり、ページ数が多いと時間がかかります。

WebsiteChatが読み取るのは「公開されているWebページ」です。

CMSの編集画面、非公開下書き、管理画面の中身は、そのプラットフォームを使っているだけでは自動では入りません。

4. クロール結果を確認する

完了後、「サイト」のページ一覧で次を確認します。

  • 料金、サービス、会社情報、問い合わせなど、よく聞かれるページが入っているか
  • 不要なページばかりになっていないか
  • 内容が現行の案内と一致しているか

AI回答の品質は、元のWebサイトの情報にも左右されます。同じ事柄がページ間で食い違っていると、チャットも迷いやすくなります。

5. チャットボットを設定する

「チャットボット」の「デザイン」で、公開サイトの見た目に寄せます。現在変更できる主な項目は次のとおりです。

  • Chatbot名
  • 待機アイコン
  • テーマカラー（ポップアップの色）
  • 吹き出しカラー
  • ウェルカムメッセージ
  • 表示位置（右下 / 左下）

6. コンソールで回答をテストする

同じ「チャットボット」画面の「テスト」で、サイトに書いてある内容の質問を先に試します。

  • 営業時間を教えてください
  • 会社所在地はどこですか
  • 料金について教えてください
  • このサービスは何ができますか
  • 問い合わせ方法を教えてください

事実関係の質問から確認します。サイトに書いてあるはずの答えが返らないときは、先に公開ページとクロール結果を見ます。モデルの問題と決めつける前に、根拠になるページがあるかを確認する。

7. Widgetコードを取得する

「チャットボット」の「設置」に、埋め込み用の短いスニペットが表示されます。形式は次のとおりです。data-site には、そのサイト用の値が入ります。

WebsiteChat Widget（例）
<script src="https://websitechat.ai/widget.js" data-site="YOUR_SITE_KEY"></script>

このコード自体は、WordPress、Wix、Studio、Shopifyなどで基本的に同じです。異なるのは「どこに貼り付けるか」です。

8. WebサイトにWidgetコードを追加する

WebsiteChatから取得したWidgetコードを、サイト全体で読み込まれる場所に追加します。設置場所は利用しているWebサイト作成サービスによって異なります。

プラットフォーム別の設置方法を見る

9. 公開サイトでWidgetを確認する

設置後は、編集画面ではなく公開URLで確認します。

  • アイコンが見える
  • 開く
  • テスト質問に答える
  • PCとスマートフォン
  • ログインしていないブラウザ、またはシークレットウィンドウ

キャッシュやCDNがあると、反映まで時間がかかることがあります。

10. サイト内容を更新した場合

料金、サービス内容、営業時間などを更新した場合は、WebsiteChat側の知識も最新状態になっているか確認してください。

コンソールの「サイト」にある「サイトを再更新」で、公開ページを再度クロールできます。Starterなどのプランでは自動再クロールもあります。間隔の保証値はプランと運用によります。更新直後は、重要ページが取り込まれたかを一覧で確認する。

11. よくある問題

Widgetが表示されない

  • スニペットを保存していない
  • サイト全体ではない場所に置いている
  • キャッシュ / CDN
  • セキュリティやJS最適化でスクリプトが止まっている
  • 公開前の下書きだけを見ている

回答が期待と違う

  • 根拠のページがクロールされていない
  • 元のページが古い
  • ページ間で説明が食い違っている
  • 答えがサイト上に公開されていない

一部のページだけWidgetが表示されない

スニペットがサイト全体で読み込まれていない可能性が高いです。置き場所は プラットフォーム別の設置方法 を見てください。

よくある質問

WebsiteChatの導入に専用プラグインは必要ですか？
基本的には必要ありません。公開Webサイトをクロールし、発行されたWidgetコードをWebサイトに追加して利用します。
WordPressやWixによってWebsiteChatの仕組みは変わりますか？
WebsiteChat側の基本的な仕組みは同じです。主な違いはWidgetコードを各プラットフォームのどこに追加するかです。
Webサイトのすべてのページをクロールする必要がありますか？
必ずしもすべてではありません。訪問者への回答に必要なサービス、料金、会社情報、FAQなどの重要ページが正しく取り込まれていることが重要です。
Webサイトを更新したら何をすればよいですか？
管理画面の「サイト」から「サイトを再更新」を実行し、公開ページを再度クロールできます。プランによっては自動再クロールもあります。更新後は、料金や営業時間などの重要ページが取り込まれているかを確認してください。
Widgetコードは全ページに設置する必要がありますか？
通常はサイト全体で読み込むことで、どのページからでも訪問者がチャットを利用できます。

あなたのWebサイトを、答えられるWebサイトへ。

Webサイトを登録して、WebsiteChatを試してみましょう。

WebsiteChatを試す 料金を見る