Dressing 
ホームページにおいてお客様との窓口となる「お問合せフォーム」。
サービス提供者なら、必ず準備しておきたいところです。
でも、
「作り方がよくわからない…」
「ちゃんと動くか心配…」
そう思って後回しにしている方も多いのではないでしょうか。
この記事では、WordPressの定番プラグイン「Contact Form 7」を使って、
お問い合わせフォームを作成する方法を、画像付きで詳しくご紹介します。
- シンプルなお問い合わせフォームが作れる
- 自動返信メールが設定できる
- 迷惑メールを防ぐスパム対策ができる
- プライバシーポリシーの整備方法がわかる
手順通りに進めれば、お客様からのお問い合わせをしっかり受け取れるフォームが完成します。
一緒に作っていきましょう。
1. お問い合わせフォームの完成イメージ
まずは「この記事でどんなフォームを作るのか」を確認しておきましょう。
今回は、どんなサービスでも共通して必要な、名前・メールアドレス・お問い合わせ内容の3項目だけを揃えた、シンプルで基本的なお問い合わせフォームを作ります。
お問い合わせフォーム完成イメージ
実際にお客様が見る画面はこのような感じになります。
シンプルで、必要な情報だけを入力してもらえるフォームです。
| 項目名（ラベル） | 入力内容 |
|---|---|
| お名前 | お名前を入力（必須項目） |
| メールアドレス | メールアドレスを入力（必須項目） |
| お問い合わせ内容 | お問い合わせ内容を入力（必須項目） |
自動返信メール完成イメージ
フォームが送信されると、以下のようなメールが自動で届くように設定していきます。
管理者宛て通知メール（あなたが受け取るメール）
お問い合わせがあったことを、あなたにお知らせするメールです。
件名：[サイト名] お問い合わせがありました
以下の内容でお問い合わせを受け付けました。
■ お名前: 山田花子
■ メールアドレス: hanako@example.com
■ お問い合わせ内容
講座について詳しく知りたいです。初心者でも参加できますでしょうか？
このメールは、あなたのウェブサイト (サイト名 https://exmaple.com) の お問い合わせフォームから送信されたものです
お客様宛て自動返信メール
お問い合わせをしてくれたお客様に、送信されたことをお知らせする自動返信メールです。
件名：お問い合わせありがとうございます
山田花子 様
このたびは、お問い合わせいただきありがとうございます。
内容を確認のうえ、3営業日以内にご連絡させていただきます。
——————————
お問い合わせ内容
——————————
■ お名前: 山田花子
■ メールアドレス: hanako@example.com
■ お問い合わせ内容
講座について詳しく知りたいです。初心者でも参加できますでしょうか？
——————————
※このメールは自動送信です。
────────────────────
○○○○（あなたのお名前）
ホームページ：https://example.com
メール：yourname@example.com
────────────────────
それでは、WordPressの定番プラグイン「Contact Form 7」を使って、
これらの設定をまとめて行なっていきましょう。
2.お問い合わせフォームの設定方法
1.Contact Form 7のインストール
お問い合わせフォームを作るために、まずは「Contact Form 7」をインストールします。
以下の手順に沿って進めてください。
WordPress管理画面の左メニューから「プラグイン」→「プラグインを追加」をクリックしてください。
画面右上の検索ボックスに「Contact Form 7」と入力して、検索結果に表示された「Contact Form 7」を確認します。
「Contact Form 7」の「今すぐインストール」ボタンをクリックします。
インストールが始まり、完了するとボタンが「有効化」に変わります。
「有効化」ボタンをクリックすると、プラグインが使える状態になります。
左メニューに「お問い合わせ」という項目が追加されたことを確認しましょう。
これで、Contact Form 7のインストールは完了です。
2.基本のお問い合わせフォームの作成
プラグインのインストールができたら、いよいよ実際にフォームを作成していきます。
今回は、名前・メールアドレス・お問い合わせ内容の3項目だけを使った、シンプルな基本フォームを作ります。
メニューから「お問い合わせ」→「コンタクトフォームを追加」をクリックします。
これで、新しいフォームを作成する画面に進みます。
最初から表示されているフォームコードは一度すべて削除し、以下のコードをそのままコピーして貼り付けてください。
<label> お名前<br />
[text* your-name] </label><br />
<label> メールアドレス<br />
[email* your-email] </label><br />
<label> お問い合わせ内容<br />
[textarea your-message] </label><br />
[submit "送信"]
フォームの上部にある「タイトル」欄に、わかりやすい名前（例：「基本のお問い合わせフォーム」）を入力し、「保存」ボタンを押します。
フォーム保存後、画面上に表示される ［contact-form-7 id="xxxx" title="お問い合わせフォーム名"］のショートコードをコピーしておきます。
これで、基本のお問い合わせフォームの作成は完了です。
次は、このお問い合わせフォームを表示させるためのページを作っていきましょう。
3. 固定ページにお問い合わせフォームを設置
ここでは、お問い合わせフォームをサイトに表示するための「お問い合わせページ（固定ページ）」を作ります。
❶ WordPressの管理画面で「固定ページ」→「固定ページを追加」をクリックします。
❷ タイトルは「お問い合わせ」など、訪問者にわかりやすい名称をつけましょう。
先ほどコピーした Contact Form 7 のショートコードを、本文エリアにそのまま貼り付けます。
このショートコードが、ページ上にフォームを表示させてくれます。
「お問い合わせはこちらからどうぞ」などの簡単な説明文を上部に追加しておくと、より親切です。
プレビューで表示を確認したら、「公開」ボタンをクリックしてページを公開しましょう。
実際のサイト上に、フォーム付きの「お問い合わせページ」が公開されます。
お問い合わせページは公開されますが、この時点ではメニューにお問い合わせページへのリンクがないため、訪問者に見られる心配はほとんどありません。安心して続けてください。
以上で、お問い合わせフォームのページは完成です。
「よし、できた！」と一息つきたくなるところですが…この流れで、自動返信メールの設定も済ませてしまいましょう。
3. 自動返信メールの設定
フォームから送信された内容に対して、自分とお客様にメールが自動で届くよう設定を行います。
ここでは、以下の2種類のメール設定を順番に進めていきます。
- 管理者宛て通知メール
- お客様宛て自動返信メール
1.管理者宛て通知メールの設定
WordPressの管理画面から「お問い合わせ」→「コンタクトフォーム」を選び、編集したいフォームの「編集」をクリックします。
フォーム編集画面の上部にある「メール」タブをクリックします。
ここで、自動返信メールの内容を設定します。
基本的に初期設定のままで使えますが、フォームの内容を変更したので、その内容に合わせて一部のタグを修正します。
| 項目名 | 設定内容（例） | 説明・補足 |
|---|---|---|
| ❶送信先（To） | [_site_admin_email] |
初期設定のままでOK。変更不要。 WordPressの管理者メールアドレス宛に送信されます。 ※別のアドレスで受け取りたい場合は、そのメールアドレスを直接入力してください。 |
| ❷送信元（From） | [_site_title]<wordpress@○○○.com> |
初期設定のままでOK。変更不要。 |
| ❸題名 | [_site_title] お問い合わせがありました |
メールの件名です。"[your-subject]" を削除して、「お問い合わせがありました」を追加。 |
| ❹追加ヘッダー | Reply-To: [your-email] |
初期設定のままでOK。変更不要。 |
| ❺メッセージ本文 | 以下の内容でお問い合わせを受け付けました。 ■ お名前: [your-name]■ メールアドレス: [your-email]■ お問い合わせ内容 [your-message]このメールは、あなたのウェブサイト ( [_site_title] [_site_url]) の お問い合わせフォームから送信されたものです |
メールの本文です。 一度すべて削除し、左のコードをそのままコピーして貼り付けてください。 |
| ❻HTML形式のメールを使用する |
□ HTML形式のメールを使用する | チェックを外します |
［your-name］ や ［your-email］ は、お問い合わせフォームで入力された内容をメールに自動で反映させるためのタグです。
たとえば [your-name] 様と書けば、実際のメールではお客様の名前が表示されます。
| タグ名 | 意味・表示される内容 | 備考 |
|---|---|---|
| [your-name] | フォームで入力された名前 | — |
| [your-email] | フォームで入力されたメールアドレス | — |
| [your-message] | フォームで入力されたメッセージ本文 | — |
| [_site_title] | WordPressサイトのタイトル名 | WordPress管理画面「設定」→「一般」にある「サイトのタイトル」 |
| [_site_url] | WordPressサイトのURL（https://〜） | 「設定」→「一般」にある「サイトアドレス (URL)」 |
| [_site_admin_email] | WordPressの管理者メールアドレス | 「設定」→「一般」で登録した管理者メールアドレス |
画面下の「保存」ボタンを押して変更を保存します。
これで、管理者（自分）宛の通知メール設定は完了です。
2.お客様宛て自動返信メールの設定
続けて、お問い合わせをしてくれたお客様宛てに送られる自動返信メールの設定を行います。
先ほど設定した管理者宛メール（メール）のすぐ下に「メール (2)」という項目がありますので、
「メール (2) を使用」 にチェックを入れてください。
チェックを入れると、お客様宛ての自動返信メールを設定する入力欄が表示されます。
以下の内容で各項目を設定していきます。
| 項目名 | 設定内容（例） | 説明・補足 |
|---|---|---|
| ❶送信先（To） | [your-email] | 初期設定のままでOK。変更不要。 お問い合わせフォームで入力されたメールアドレス宛に送信されます。 |
| ❷送信元（From） | [_site_title]<wordpress@○○○.com> | 初期設定のままでOK。変更不要。 |
| ❸題名 | お問い合わせありがとうございます | お客様が受け取るメールの件名です。 [_site_title] “[your-subject]” を削除して、「お問い合わせありがとうございます」を入力。 |
| ❹追加ヘッダー | Reply-To: [_site_admin_email] | 初期設定のままでOK。変更不要。 お客様がこのメールに返信する場合の「宛先」で、WordPressの管理者メールアドレスに設定されています。 ※別のアドレスで受け取りたい場合は、そのメールアドレスを直接入力してください。 |
| ❺メッセージ本文 | [your-name] 様 このたびは、お問い合わせいただきありがとうございます。 内容を確認のうえ、3営業日以内にご連絡させていただきます。 —————————— お問い合わせ内容 —————————— ■ お名前: [your-name] ■ メールアドレス: [your-email] ■ お問い合わせ内容 [your-message] —————————— ※このメールは自動送信です。 ──────────────────── ○○○○（あなたのお名前） ホームページ：https://example.com メール：yourname@example.com ──────────────────── |
メールの本文です。 左の内容を貼り付けた上で、必要に応じてアレンジしてください。 |
| ❻HTML形式のメールを使用する （チェックボックス） |
チェックを外します | — |
メール(2)の設定時、「 安全でないメール設定が十分な防御策なく使われている」という警告が表示されることがあります。
これは、送信先に [your-email] を使っているためですが、後ほど設定するスパム防止対策（reCAPTCHA）によって自動的に解消されます。今は気にせず、そのまま設定を続けて大丈夫です。
画面下の「保存」ボタンを押して変更を保存します。
これで管理者向け・お客様向けの自動返信メール設定は完了です。
実際に問い合わせがあると、設定したメールアドレスに通知が届きます。
まずはテスト送信をして、ちゃんと届くかどうか確認してみましょう。
やり方は次の章で詳しくご紹介します。
4.テスト送信で動作を確認
ここまでで、お問い合わせフォームの基本設定とメール送信の仕組みが整いました。
運用を始める前に、実際にフォームに入力・送信して、以下の点をチェックしましょう。
- フォームが正しく動作するか
- 管理者宛て・お客様宛ての自動返信メールがちゃんと届くか
- メールの内容（表示や文面）に誤りや不自然な点がないか
WordPressの管理画面から「固定ページ」→「固定ページ一覧」をクリックします。
先ほど作成した「お問い合わせ」ページの「表示」リンクをクリックしてページを開きます。
お問い合わせフォームに、名前・メールアドレス・問い合わせ内容を入力し、送信ボタンを押します。
- 送信完了メッセージ「ありがとうございます。メッセージは送信されました。」が表示されるか
設定した管理者メールアドレスにメールが届くかチェックします。
- 件名や本文に誤字や変なタグがないか
- フォームで入力した内容（名前、メールアドレス、問い合わせ内容）が正しく表示されているか
お問い合わせフォームに入力したメールアドレス宛に自動返信メールが届いているか確認します。
- メール本文にお名前やメールアドレス、問い合わせ内容が正しく表示されているか
- 件名や案内文に誤りやわかりにくい表現がないか
以上で、フォームの動作確認は完了です。
もし、送信がうまくいかない・メールが届かないといったトラブルがある場合は、以下の「チェックポイント」を参考に原因を探ってみてください。
うまくいかないときの簡単なチェックポイント
設定画面のメールアドレス入力ミス
管理者メールアドレスや返信用メールアドレスに誤字があるとメールが届きません。
「.com」や「.jp」などのドメインの入力忘れや、全角入力になっていないかもチェックしましょう。
迷惑メールフォルダの確認
メールが届かない場合、迷惑メールフォルダに振り分けられていることがあります。
迷惑メール設定を見直したり、ドメイン指定受信の設定を行うと改善することがあります。
メール送信元アドレスの設定
送信元メールアドレス（返信用メール）が管理者メールアドレスと同じだと、メールが届きにくいことがあります。特に問題がなければ、初期設定されている[_site_title]<wordpress@○○○.com>を使うのがおすすめです。
ここまでで、お問い合わせフォームはひとまず完成です。
このままでもフォームは使えますが、
本格的にお客様とやりとりをしていくなら、スパム対策やプライバシーポリシーも整えておくのがおすすめです。
ここを整えておくことで、あとで困らずにすみますよ。
5. スパム対策とプライバシーポリシーの整備
お問い合わせフォームはインターネット上に公開されるので、スパム業者に狙われて迷惑メールが大量に届く可能性があります。
また、お客様の個人情報をお預かりする以上、プライバシーポリシーの整備も欠かせません。
どちらも手順通りに進めれば簡単にできますので、一緒に進めていきましょう。
1. スパム対策（Google reCAPTCHAの導入）
スパム送信を防ぐために、GoogleのreCAPTCHA（リキャプチャ）を導入します。
人間とコンピューター（bot）を見分けるGoogleの無料セキュリティサービス。フォーム送信時に、人間の行動パターンを自動で判別して、悪質な自動送信をブロックしてくれます。
reCAPTCHAの設定方法については、下記の記事で詳しく解説していますので、
こちらを見ながら設定を進めてください。
reCAPTCHAの設定が終わったら、この記事に戻って次のステップに進んでくださいね。
2. プライバシーポリシーの整備
お問い合わせフォームでは、お客様の名前やメールアドレスといった個人情報を受け取るため、
- どんな情報を取得し、
- どんな目的で使用するのか
を明記した「プライバシーポリシーページ」があると、お客様の安心感につながります。
個人情報保護法の観点からも、このページはしっかり用意しておくことをおすすめします。
プライバシーポリシーに記載しておきたい内容
- 取得する情報の種類（名前・メールアドレスなど）
- 利用目的（お問い合わせ対応のため）
- 第三者への提供有無（基本的にしない旨）
- 情報の管理方法（厳重に保管する、一定期間後に削除など）
- お問い合わせ先（情報削除の依頼先など）
【コピペOK】プライバシーポリシー例文
これからご紹介する３つの例文は、どれもそのまま使えます。
あなたのサイトに合わせてアレンジしてご使用ください。
例1
個人情報の利用目的
当サイトのお問い合わせフォームでは、お名前、メールアドレスなどの個人情報を入力していただくことがあります。
これらの情報は、お問い合わせへの対応やご連絡のためにのみ利用し、その他の目的で使用することはありません。
お預かりした個人情報は適切に管理し、お客様の同意なく第三者に提供することはございません。
例2
個人情報の取扱いについて
当サイトは、個人情報保護法に基づき、以下の通り個人情報を適正に取扱います。
収集する情報： お問い合わせフォームにおいて、氏名、メールアドレス等を収集いたします。
利用目的： 収集した個人情報は、お問い合わせ対応および必要な連絡に限定して利用いたします。
第三者提供： 法令に基づく場合を除き、個人情報を第三者に提供することはありません。
安全管理： 個人情報の漏洩、滅失、毀損の防止その他安全管理のため、必要かつ適切な措置を講じます。
保存期間： 利用目的達成後、速やかに削除いたします。
例3
個人情報の取り扱い
お問い合わせフォームでお預かりするお名前やメールアドレス等の個人情報は、お問い合わせへのご回答とサービスに関するご連絡にのみ使用いたします。
これらの情報を他の目的で使用したり、お客様の許可なく外部に提供したりすることは一切ありません。また、適切なセキュリティ対策を講じて大切に管理いたします。
個人情報に関してご質問やご要望がございましたら、お気軽にお問い合わせください。
以上で、スパム対策とプライバシーポリシーの整備は完了です。
完成までもう少し！あと1ステップだけお付き合いください
6.メニューにお問い合わせページを追加する
最後に、お客様が簡単にアクセスできるよう、サイトのメニューにお問い合わせページを追加しましょう
WordPress管理画面の左メニューから「外観」→「メニュー」をクリックします。
既存のメニューがある場合は選択して「選択」ボタンをクリックします。
メニューがない場合は「新しいメニューを作成しましょう」をクリックして新規作成します。
画面左側の「固定ページ」セクションで「お問い合わせ」にチェックを入れ、「メニューに追加」ボタンをクリックします。
追加されたお問い合わせページを、ドラッグ＆ドロップでお好みの位置に移動させます。
「メニューを保存」ボタンをクリックして変更を保存します。
メニューに追加されたことで、お客様がお問い合わせフォームに簡単にアクセスできるようになりました。
これで、お問い合わせフォームの設定はすべて完了です！
まとめ
ここまで本当におつかれさまでした。
一つ一つの手順はシンプルですが、設定項目が多くてなかなか大変でしたよね。
でも、これでお問い合わせフォームの基本はしっかり整いました。
ここで紹介した内容を参考に、ぜひあなたらしいフォームを作ってみてくださいね。
