「WordPressを使っていないサイトにもチャットボットを設置したい……」
YL Chatbot Universalは、タグを貼り付けるだけでどんなサイトにも設置できるSaaS型のAIチャットボットです。WordPressプラグイン版と違い、サーバーへのインストールも不要。申し込んだその日に稼働を開始できます。
この記事では、申し込みから稼働開始まで、画面キャプチャ付きで丁寧に解説します。
目次
事前に確認しておくこと
YL Chatbot Universalはインストール作業が不要なため、準備するものはとてもシンプルです。
- 設置したいサイトのURL：申し込み時に入力します
- メールアドレス：マイページのログインIDになります
- クレジットカード：30日間の無料トライアル開始時に登録します（トライアル中に解約すれば費用は一切かかりません）
- サイトのHTML編集権限：</body>直前にタグを追加します
OpenAI APIキーの用意は不要です。ライト・スタンダードプランではAPIキーはヨコハマラボが管理しており、利用料もプラン料金に含まれています。
ステップ1：申し込む
以下のページからプランを選択し、必要事項を入力して申し込みを完了させます。
入力項目は以下の5つだけです。
- お名前
- 利用予定サイトURL
- メールアドレス（マイページのログインIDになります）
- パスワード（8文字以上）
- クレジットカード情報
「無料トライアルを始める」ボタンをクリックすると、数分以内に登録メールアドレス宛に確認メールが届きます。
ステップ2：メールで設置タグを受け取る
申し込み完了後に届くメールに、以下の2つが記載されています。
- マイページURL・ログイン情報
- 設置用のscriptタグ（例：
<script src="https://ylabapp.com/chatbot/assets/js/widget.js" data-api-key="xxxxxxxx"></script>）
ステップ3：サイトにタグを貼り付ける
メールに記載された<script>タグを、設置したいサイトのすべてのページの</body>直前にコピー＆ペーストします。
WordPressサイトの場合
WordPress管理画面 →「外観」→「テーマエディター」→「footer.php」を開き、</body>の直前にタグを貼り付けます。または「外観」→「ウィジェット」→「フッター」エリアに「カスタムHTML」ブロックを追加する方法でも対応できます。
HTML/静的サイトの場合
各HTMLファイルの</body>直前にタグを追加します。テンプレートファイルがある場合は1ファイルを編集するだけで全ページに反映されます。
Wix・STUDIO・Shopifyなどの場合
各サービスの「カスタムコード」や「HTMLブロック」機能を使って</body>直前に追加します。具体的な手順はご利用のサービスのヘルプをご参照いただくか、ヨコハマラボまでご相談ください。
タグを貼り付けてページを更新すると、サイト右下にチャットボタンが表示されます。
ステップ4：マイページにログインする
以下のURLからマイページにログインします。
ログインIDは申し込み時に登録したメールアドレスです。
ダッシュボードでは以下の情報を確認できます。
- 今月のチャット利用回数と残り回数
- 現在のプラン
- 埋め込み用APIキー（設置タグの再確認に使えます）
ステップ5：FAQを登録する
上部メニューの「📝 FAQ管理」をクリックします。ページ上部の入力フォームに「カテゴリ」「質問」「回答」を入力して「FAQを追加」をクリックすると、一覧に追加されます。
FAQはCSVで一括インポートすることもできます。「CSVインポート」から雛形CSVをダウンロードし、Excelで記入して再アップロードするだけで大量のFAQをまとめて登録できます。
FAQの書き方のコツ
- 質問は具体的に：「料金は？」より「月額費用はいくらですか？」の方がAIの回答精度が上がります
- 回答はそのまま使える文章で：AIがFAQをそのまま参照するため、読みやすい文章で書くと回答もきれいになります
- まずは10〜20件から：少なくても十分機能します。実際の問い合わせを見ながら育てていきましょう
ステップ6：デザインを調整する
上部メニューの「⚙️ 設定」をクリックします。以下の項目をサイトのデザインに合わせて変更できます。
| 設定項目 | 内容 |
|---|---|
| チャットヘッダータイトル | チャットウィンドウ上部に表示されるタイトル |
| ウェルカムメッセージ | チャットを開いたときに最初に表示される一言 |
| キャラクター設定 | AIへの指示文（口調・役割・回答スタイルを自由に設定） |
| メインカラー | チャットヘッダーの背景色 |
| 送信ボタンカラー | メッセージ送信ボタンの色 |
| 掲載位置（PC／スマホ） | チャットボタンの下・右からの距離（px単位） |
設定を保存すると即座にサイトに反映されます。
ステップ7：動作テストをする
実際にサイトのチャットボタンをクリックして、動作を確認しましょう。
- ウェルカムメッセージが表示されているか
- 登録したFAQに関連する質問を入力して、適切な回答が返ってくるか
- スマートフォンでも正常に表示・操作できるか
会話ログは上部メニューの「📊 会話ログ」からいつでも確認できます。どんな質問が来ているかを見ながら、FAQを追加・改善していきましょう。
よくある質問
回答の精度を上げるにはどうすればいい？
FAQの件数を増やすことが最も効果的です。また、「設定」→「キャラクター設定」にAIへの指示文を記入すると回答の口調や方向性が整います。例：「あなたは〇〇会社の親切なサポート担当です。丁寧な言葉遣いで、簡潔に回答してください。」
多言語設定はどうしたらよい？
特別な設定は一切不要です。YL Chatbot Universalはユーザーが使った言語で自動的に回答する仕組みになっています。FAQは日本語で登録するだけで、英語・中国語・フランス語など別の言語で質問が来ると、AIが自動でその言語に翻訳して回答します。
動作確認済みの言語：🇯🇵 日本語 🇺🇸 英語 🇫🇷 フランス語 🇪🇸 スペイン語 🇧🇷 ポルトガル語 🇨🇳 中国語 🇮🇹 イタリア語 🇩🇪 ドイツ語 🇸🇦 アラビア語 🇵🇭 タガログ語 🇰🇷 韓国語
※ 翻訳精度はAIモデルに依存します。すべての言語・表現で正確な回答を保証するものではありません。
チャットボットが「わかりません」と答えてしまう
その質問に対応するFAQが登録されていない可能性があります。「会話ログ」でどんな質問が来ているかを確認し、対応するFAQを追加しましょう。
プランを途中で変更できますか？
はい、マイページのダッシュボードからいつでもアップグレード・ダウングレードが可能です。変更は次の更新日から適用されます。
解約はどこからできますか？
マイページのダッシュボード下部の「解約手続き」から手続きできます。解約後は次の更新日以降の課金が停止されます。
まとめ：稼働開始までの流れ
| ステップ | 作業内容 | 目安時間 |
|---|---|---|
| 1 | LPから申し込む | 3分 |
| 2 | メールで設置タグを受け取る | 数分以内に届く |
| 3 | サイトにタグを貼り付ける | 5分 |
| 4 | マイページにログイン | 1分 |
| 5 | FAQを登録する（10件程度） | 20分 |
| 6 | デザイン・文言を調整 | 5分 |
| 7 | 動作テスト | 5分 |
操作でわからないことや、うまく動作しない場合は、ヨコハマラボまでお気軽にお問い合わせください。日本語でサポートします。