WordPressにチャットボットを設置する方法【コピペ5分・初心者向け】
WordPressで作ったサイトに、お客様の質問へ自動で答えるチャットボットを設置する手順を解説します。 プログラミングの知識は不要です。公式プラグインを使えばコードを触る必要がなく、5分ほどで完了します。
この記事でできるようになること
サイトの右下にチャットボタンが表示され、訪問者が質問すると、事前に登録したFAQをもとにAIが自動で回答するようになります。
準備するもの
公式プラグインを使う場合(方法1)は、サイトIDだけあれば設置できます。 管理画面にログインすると表示されます。
方法2以降で使う場合のために書いておくと、埋め込みコードは次のような1行です。
FAQuickの場合、管理画面にログインすると、「埋め込みコード」の欄に表示されます。「コードをコピー」ボタンで丸ごとコピーできます。
方法1:FAQuickの公式プラグインを使う(推奨)
コードを一切触らない方法です。WordPress公式のプラグインディレクトリで配布しているので、 管理画面から検索してそのまま入れられます。テーマのファイルを開く必要も、コードを貼る必要もありません。
コードの扱いに慣れている方にも、こちらをおすすめします。手軽さだけの話ではありません。
- テーマを変えても設定が残ります。設定はテーマではなくWordPress側に保存されるためです
- テーマを更新しても消えません。コードを書き足す方法では、更新で消えることがあります
- サイトIDの形式を確かめます。貼り間違えたまま気づかない、ということが起きません
- やめるときはプラグインを停止するだけです。どこに何を書いたか探す必要がありません
プラグインをインストールする
WordPressの管理画面で「プラグイン」→「新規プラグインを追加」を開き、FAQuick と検索します。見つかったら「今すぐインストール」→「有効化」をクリックします。
サイトIDを貼る
管理画面の「設定」→「FAQuick」を開き、サイトIDを貼って保存します。サイトIDはFAQuickの管理画面に表示されています。
確認する
自分のサイトを開いてください。右下にチャットボタンが表示されていれば完了です。
サイトIDを入れるまで、プラグインは外部との通信を一切行いません。設置をやめたいときは、プラグインを停止するだけで表示が消えます。
コードで設置する方法
レンタルサーバーの制限などでプラグインを追加できない場合や、 すでに他のコードをまとめて管理している場合は、以下の方法でも設置できます。 結果は方法1と同じです。
方法2:ヘッダー・フッター用のプラグインを使う
「ヘッダー・フッターにコードを追加できるプラグイン」を使います(例:WPCode など)。
プラグインをインストールする
WordPressの管理画面で「プラグイン」→「新規プラグインを追加」を開き、WPCode と検索します。見つかったら「今すぐインストール」→「有効化」をクリックします。
フッターにコードを追加する画面を開く
左メニューに追加された「Code Snippets」→「Header & Footer」を開きます。「Header」「Body」「Footer」の3つの入力欄が表示されます。
「Footer」欄に貼り付ける
「Footer」の欄に、用意した埋め込みコードをそのまま貼り付けます。ヘッダーではなくフッターに貼るのは、ページの表示を遅くしないためです。
保存して確認する
「Save Changes」で保存し、自分のサイトを開いてください。右下にチャットボタンが表示されていれば完了です。
方法3:テーマのフッターに直接書く
⚠️ 先に注意点をお伝えします。
この方法には2つのリスクがあります。
① テーマを更新すると、書いたコードが消えます(子テーマを使えば回避できます)
② ファイルの編集を1文字間違えると、サイト全体が表示されなくなることがあります
プラグインを追加できる環境であれば、方法1をお使いください。結果は同じで、上のリスクもありません。
テーマファイルエディターを開く
管理画面で「外観」→「テーマファイルエディター」を開きます。編集するテーマが子テーマになっているか確認してください。
footer.php を開く
右側のファイル一覧から「テーマフッター(footer.php)」を選びます。
</body> の直前に貼り付ける
ファイルの下の方にある </body> という行を探し、その直前の行に埋め込みコードを貼り付けます。
「ファイルを更新」して確認する
保存してサイトを開き、右下にチャットボタンが出ていれば完了です。
方法4:テーマの「カスタムコード」欄を使う
テーマによっては、最初からコードを追加できる欄が用意されています(Cocoonなど、国産テーマに多い機能です)。 テーマの設定画面に「フッター用コード」「カスタムHTML」といった項目があれば、そこに貼るのが最も手軽です。 テーマ更新で消える心配もありません。
チャットボタンが表示されない時は
| 原因 | 対処 |
|---|---|
| キャッシュ | キャッシュ系プラグイン(WP Super Cache、LiteSpeed Cache など)を使っている場合、古いページが表示されています。キャッシュを削除してから、ブラウザも Ctrl + F5 で強制再読み込みしてください。 |
| セキュリティプラグイン | 外部スクリプトの読み込みを制限している場合があります。設定を確認し、faquick.net を許可してください。 |
| 貼る場所が違う | コードがコメントの中(<!-- と --> の間)に入っていると、まったく動作しません。コメントの外に出してください。 |
| コードが途中で切れている | 末尾の </script> まで、省略せず貼れているか確認してください。 |
よくある質問
サイトが重くなりませんか?
フッターに設置すれば、ページ本体の表示が終わってからチャットが読み込まれるため、表示速度への影響はほとんどありません。
特定のページにだけ表示できますか?
方法2のプラグインには、表示条件を指定できる機能があるものもあります。全ページに出したくない場合は、そちらをご検討ください。
WordPress.com(無料ブログ版)でも使えますか?
WordPress.comの無料プランでは、外部のJavaScriptを追加できません。ビジネスプラン以上、または自分でサーバーを借りて運用するWordPress.org版であれば利用できます。
FAQuickなら、月額4,980円から
商談も見積もりもなし。メールアドレスかGoogleアカウントで登録して、コードを1行貼るだけ。
カード登録なしの無料プラン(月50回答・期限なし)からお使いいただけます。
