ホームページを作ったら、次に整えておきたいのがお問い合わせフォームです。
SNSのDM（ダイレクトメッセージ）だけでも連絡は受けられますが、仕事用のホームページには、正式に相談できる入口があると安心です。
ひとり起業の場合、お問い合わせフォームは単なる連絡先ではなく、仕事の相談や依頼につながる大事な入口。
今回は、WordPressの無料プラグイン「WPForms」を使って、お問い合わせフォームを作り、固定ページに設置するところまでの流れをまとめました。設定する項目はやや多いですが、順番に進めていけば、初めての方でも形にしていけます。
問い合わせフォームは仕事の相談口
お問い合わせフォームとは、名前やメールアドレス、問い合わせ内容などを入力してもらい、その内容をホームページの管理者宛てに送る「ホームページの窓口」です。
サービスに興味を持った方が問い合わせをしようとしたとき、そこがなかったら、よほど強い関心がない限り、そのまま離れてしまうでしょう。「気にはなるけれど、連絡先がSNSのDMだけか……」と感じた瞬間に手が止まってしまう方も、一定数います。
問い合わせフォームは「絶対になければいけない」というものではありません。業種やターゲットによっては、SNSのDMやLINE公式アカウントだけで十分に機能しているケースもあります。
ただ、窓口をSNSやLINEだけにするのは、いくつか気になるリスクがあります。
まず、特定のSNSやLINEのアカウントを持っていない方や、「プライベートなアカウントを企業に知られたくない」と感じる方は一定数います。そういった方が連絡をあきらめてしまうと、機会の損失になりやすいです。
次に、特に高額な商品・サービスを扱っている場合、「連絡先がSNSのDMだけ」という状態は信頼感に影響します。フォームがひとつあるだけで、「ちゃんとした窓口を持っている」という印象につながりやすくなります。
もうひとつ、実務面での話をすると、DMやLINEは自由記述のチャット形式なので、「誰から」「どんな用件で」「返信先はどこか」といった情報が一度のメッセージでそろわないことがよくあります。
フォームであれば、名前・メールアドレス・お問い合わせの種別などを必須項目として設定できるので、受け取ったあとのやり取りがスムーズですね。
フォームとSNS・LINEを比べると
| 特徴 | お問い合わせフォーム | SNSのDM／LINE |
|---|---|---|
| 対象ユーザー | 誰でも（アカウント不要） | そのアプリの利用者のみ |
| 心理的なハードル | やや高め（かしこまった印象） | 低い（気軽に送れる） |
| 企業への信頼感 | 高い | やや低め〜普通 |
| 必要な情報の取得 | 確実（必須項目を設定できる） | 不確実（複数回のやり取りが必要になることも） |
| 管理・チームでの共有 | しやすい | ツールによっては手間がかかることも |
どちらか一方に絞る必要はない
フォームとSNS・LINEは、「どちらかを選ぶ」というものではなく、両方を用意しておくと使いやすいです。
ホームページには、まず「お問い合わせフォーム」を基本の窓口として置いておきます。
そのうえで、フォームの近くに「簡単なご質問はLINEやInstagramのDMからも受け付けています」と添えておくと、来てくれた人が自分に合う方法で連絡できます。
ひとり起業の場合は、業種で分けるよりも、問い合わせの内容で考えるとわかりやすいです。
見積もり依頼、制作相談、講座やサポートの申し込みなど、内容をきちんと残しておきたい連絡はフォームが向いています。
一方で、日程の確認やちょっとした質問、既存のお客さまとのやり取りは、LINEやSNSのDMのほうが気軽な場合もあります。
- フォームは仕事用の基本窓口
- LINEやSNSのDMは、気軽な連絡用の補助窓口
このように分けておくと、ひとり起業のホームページでも使いやすくなりますね。
お問い合わせフォームを作る前に
フォームを作り始める前に、「どんな項目を入れるか」をある程度イメージしておきましょう
あれも知りたい、これも知りたいと、項目が多いと、入力する側の手間が増えて問い合わせをやめてしまう人もいます。フォームに入力してもらう項目は最低必要減にとどめましょう。
一般的には、次の項目があればOK。
- 名前
- メールアドレス（確認のため2回入力）
- 連絡先電話番号
- ご希望の連絡方法（メールまたは電話）
- お問い合わせ内容（複数選択）
自分のビジネスの内容に合わせて、どんな情報を最初にもらえると対応しやすいかを考えながら、項目を組み立ててみてください。まずはシンプルな構成から始めて、運用しながら調整していくのが進めやすいです。
お問い合わせページ作成の流れ
お問い合わせページの作成は、大きく分けると次の4ステップです。
- フォームを作成：プラグイン「WPForm」のインストールと設定
- 固定ページを作成：お問合せページの作成
- セキュリティの設定：Cloudflareの登録と問い合わせページへの設定
- 送信テスト：フォームのテスト
まず、フォーム自体を作成し、それをお問い合わせページに貼り付ける。お問い合わせページにセキュリティを設定したら、フォームが正常に稼働するかテストをする・・・という流れになります。
花子なんだか大変そう。
すずのりひとつずつ手順を踏んでいけば大丈夫です。
お客様との接点になる大事なページなので、ここは、しっかりつくっていきましょう。
WPFormsプラグインでフォーム作成
WordPressでお問い合わせフォームを作るには、プラグインを使うのが一般的です。プログラムの知識がなくても、管理画面の操作だけでフォームを作って設置できるようになります。
フォーム作成系のプラグインはいくつかありますが、今回は「WPForms」を使います。
有名なお問合せフォーム系プラグインには「Contact Form 7」がありますが、初心者には設定がややこしいかなと感じます。
WPFormsは、無料版でも基本的なフォームを作るのに十分な機能が揃っているし、あらかじめテンプレートが用意されているので、ゼロから項目を組み立てなくても、テンプレートをベースにカスタマイズしながら進めていけます。
WordPressを使い始めたばかりの方でも、操作の流れが比較的つかみやすいプラグインです。
ここからは、実際にWPFormsをインストールして、フォームを作っていきます。
WPFormsをインストールする
まずは、WPFormsをインストールするところから始めます。
左サイドメニュープラグインから新規プラグインを追加を選びます。
プラグインの検索枠にWPFormsと入力します。
クマのアイコンが目印になっているプラグインが、今回使うWPFormsです。
WPFormsを見つけ今すぐインストールをクリック。
インストールが終わりましたら、青ボタンの有効化をクリック。
「WPFormsへようこそ」という画面が表示されたら、インストールは完了です。
ログイン後、左サイドメニュープラグインからインストール済みプラグインを選びます。
WPFormsを探し、自動更新を有効化をクリック。
管理画面の左側のメニューに「WPForms」という項目が追加されます。ここから、フォームの作成に進みます。
お問い合わせフォームを作る
左サイドメニューWPFormsの中にあるAdd New Formをクリックし、はじめるを選びます。
「フォームビルダーへようこそ」という画面ははじめるをクリックします。
操作中に画面の右上や右下に小さなウィンドウが表示されることがありますが、これは無視して問題ありません。
フォームに名前をつける画面が出てきたら、「お問い合わせフォーム」と入力します（図中①）。
ゼロから項目を作るのではなく、あらかじめ用意されているテンプレートを使うと進めやすいです。今回は「簡単なお問い合わせフォーム」というテンプレートを選びます。
このテンプレートには、最初から3つの項目（名前・メールアドレス・コメントまたはメッセージ）が用意されています。
ここから、必要な項目を整えていきます。
「コメントまたはメッセージ」という項目名を、「お問い合わせ内容」という名前に変更します。
入力フォームの該当項目エリアをクリックすると、左側にその項目の設定（フィールド設定）が表示されます。
左側でラベルを「お問い合わせ内容」に変更し、必須項目としてチェックを入れておきます。
次に、名前の項目は、「名」「姓」の順番で表示されています。日本語の「姓名」の順番とは違いますが、これは入力ミスにつながるものではないので、そのままで大丈夫です。
次に、右側のメールアドレスのエリアをクリックし、左側のフィールド設定でメールでの確認を有効化をオンにします。
これを設定すると、メールアドレスを2回入力してもらう形になります。1回目と2回目で入力したメールアドレスが一致しているかを確認できるので、入力ミスによる連絡漏れを減らすことができます。
ここから、フィールド（項目）を3つ追加していきます。
まず、フィールドを追加をクリック。
標準フィールドの中から数字を選びます（図中①）。すると、「数字」という名前の項目がお問合せフォームに追加されます（図中②）。
追加した「数字」フィールドをクリックし、左側のフィールド設定で、ラベルを「連絡先お電話番号」に変更します（図中①）。
説明欄には、「ハイフンなしで数字のみ」という案内と、入力例を入れておきます（図中②）。
続けて、「ご希望の連絡方法」という項目を追加します。これは、お問い合わせをした人に、メールと電話のどちらで連絡を受け取りたいかを選んでもらうための項目です。
フィールドを追加（図中①）をクリックし、多項選択式（図中②）を選びます。
多項選択式は、いくつかの選択肢から1つを選んでもらうための項目です。
右側の追加したフィールドをクリックし、左側にフィールド設定画面を表示します。
ラベルを「ご希望の連絡方法」に変更します。
選択肢は「メール」「お電話」の2つにし、テンプレートにもともと入っている3つ目の選択肢は「ー」をクリックして削除します。
最後に、必須にチェックを入れます。
最後に、「必須」にチェックを入れます。
最後に、「お問い合わせ内容」の項目を追加します。これは、何のお問い合わせかを選んでもらうための項目です。選択式にした方がお問合せがスムーズになります。
フィールドを追加をクリックし、チェックボックスを選びます。追加した項目をクリックし、ラベルを「お問い合わせ内容」に変更します。
右側のフォームに追加したチェックボックスエリアをクリックし（図中①）、右側でラベルを「お問い合わせ内容」に変更します（図中②）。
選択肢には、「レッスンに関する質問」「ピラティス授業」「取材依頼」を入力します。
選択肢が足りない場合は、「+」のボタンをクリックすると追加できるので、ここで「その他」も加えておきます。
最後に、「必須」にチェックを入れます。
ここまでで項目はそろいましたが、フォームの中での項目の順番も整えておきます。
「お問い合わせ内容」をマウスでドラッグして、フォームの一番下に移動させます。
入力フォームの項目が多いと、お問い合わせをする側からすると、入力の手間が増えるので、今回くらいの項目数が、ちょうどよいバランスでしょう。
項目の設定が終わったら、一度保存しておきます。保存をクリック。
保存したあとは、プレビューをクリックしてフォームの見た目を確認してみましょう。
実際の画面で見ると、入力する側の目線でフォームを確認できるので、ここで一度チェックしておくと、あとで気になる部分があっても直しやすくなります。
確認後はフォームの設定画面に戻ります。
フォームからのメールの通知設定をする
フォームに入力された内容は、メールで管理者に届くようになっています。ここからは、そのメールの設定をしていきます。
左サイドメニュー設定をクリックし（図中①）、通知をクリックします（図中②）。
「送信先メールアドレス」は、お問い合わせの内容を受け取るメールアドレスです。デフォルトでは、WordPressをインストールしたときに設定した管理者メールアドレスになっています。
このままでも使えるのですが、お問い合わせをした人に、送信後「お問い合わせありがとうございます」というメッセージが表示されるだけで、レシート代わりの確認メールを送ることができません。
そこで、「①管理者」と「②お問い合わせをした人」の両方に、同じメールが届くように設定します。
管理者のメールアドレスのすぐ後ろをクリックし、半角のカンマを入力します。この半角のカンマがないと、どちらにもメールが届かなくなってしまうので、ここは注意したいポイントです。
続けて、送信先メールアドレスの欄にあるタブのマークをクリックし（図中①）、「利用可能なフィールド」からメールアドレスを選びます（図中②）。
これで、管理者とお問い合わせをした人の両方にメールが届くようになります。
お問い合わせをした人にもメールが届くようになったので、見た目を少し整えておきます。
まず、メールの件名を「お問い合わせありがとうございました」に変更します。
フォーム名にはホームページ名が表示されていると思いますが、そのままで大丈夫です。
送信元のメールアドレスには、管理者のメールアドレスが設定されていますが、このとき、その下に警告メッセージが表示されることがあります。
これは、管理者メールアドレスにGmailなどを設定していたり、ホームページのドメインと異なるメールアドレスを指定していたりすると、通知メールがなりすましやスパムと判断されやすくなり、相手にブロックされたり、迷惑メールフォルダに入ってしまったりする可能性が高くなるための警告です。
ホームページのドメインを使ったメールアドレスを送信元に指定しておくと、相手の受信トレイに届きやすくなります。
「Reply to」は、メールを返信したときの送信元メールアドレスになりますが、ここは何も入力せず、空白にしておきます。
「×」マークをクリックすると削除できます。
メールメッセージの欄には、初期設定で入力された内容がそのまま表示されるようになっていますが、それだけだと無機質な印象になります。
そこで、メール本文にひと言メッセージを追加しましょう。
青く表示されている「All Fields」の直前にカーソルを置き、2行分の改行を入れます。
1行目をクリックして、お問い合わせをいただいたことへのお礼など、メッセージを入力します（図中①）。
ここまで設定できたら、保存をクリックし（図中②）、右上の「×」をクリックして（図中③）フォームの設定画面を閉じます。
「お問い合わせフォーム」という名前でフォームが出来ました。
フォーム自体は出来たので、これをお問合せページに貼り付けていきます。
お問い合わせページを作る
フォーム自体はこれで完成したので、次に、このフォームを「お問い合わせページ」に設置していきます。
固定ページから固定ページを追加を選びます。
タイトルには「お問合せ」と入力します。
「＋」をクリックしてフォームのブロックを追加します。
ブロックの検索欄に「WP」と入力します。表示された「WPForms」ブロックを選びます。
「WPForms」ブロックが表示されるので、その中から、先ほど作成したお問い合わせフォームを選択すると、フォームがページに貼り付けられます。
ページにフォームだけだと味気ないので、フォームの前に、問合せしやすいように文章を入れておきます。
WPフォームのブロックを選択し、「︙」縦三点リーダーをクリック（図中①）。前に追加をクリックすると（図中②）、WPフォームの前に段落ブロックが挿入されます。
挿入された段落ブロックに、お問合せしやすくなるような文章を入力します。
文章が長くなりすぎると、フォームまでの距離が遠くなり、入力する前に離れてしまう人が増えてしまうかもしれませんので、簡潔に入力しましょう。
固定ページには、それぞれURL（スラッグ）が設定されます。
お問い合わせページでよく使われるスラッグに「contact」がありますが、「contact」というスラッグは、お問い合わせページであることが一般的に知られているため、ハッカーから狙われやすくなる面があります。
そのため、スラッグは違う名前をおすすめします。
ここではスラッグを「お問合せ」から「toiawase」に変更しておきます。
最後に、メタディスクリプションを設定し、設定が終わったら、公開をクリックしてページを公開します。
フォームのスパム対策
お問い合わせフォームは、スパムボットと呼ばれる自動プログラムに狙われやすく、大量の迷惑メールが届くリスクがあります。また、お問い合わせページは個人情報を扱う場所でもあるため、スパム対策はフォームの設置と同時に設定しておきたいところです。
今回は「Cloudflare Turnstile（クラウドフレア ターンスタイル）」という無料ツールを使ってスパム対策をします。
一度はどこかのホームページで見たことがあるのではないでしょうか？
フォームに「私はロボットではありません」というチェックボックスが表示される、あの仕組みです。
Cloudflare Turnstileは、人間とボット（自動プログラム）を区別するためのツールで、フォームに認証ボックスを表示することでスパムを防ぎます。お問合せページに設置しておきましょう。
Cloudflare Turnstileのアカウント作成
まず、Cloudflare Turnstileのページにアクセスしてアカウントを作成します。
利用開始ボタンをクリックすると、さっそくCloudflare Turnstileが人間であることを確認してきますね。「私はロボットではありません」にチェックを入れます。
Googleアカウントで続行する方法と、メールアドレスとパスワードで新規登録する方法のどちらでも構いません。
新しくパスワードを作成する場合は、8文字以上で、数字と記号をそれぞれ1文字以上含める必要があります。
「人間であることを確認します」にチェックを入れ、「成功しました！」と表示されたら、サインアップをクリックします。
画面が英語で表示されている場合は、右上から日本語に変更できます。
なお、Cloudflare Turnstileの画面の日本語表示と、ブラウザでの翻訳機能による日本語表示では、若干の言い回しの違いが出ることがあります。意味は同じなので、参考程度に見てもらえれば大丈夫です。
サイトキーとシークレットキーを取得
ウィジェットを追加をクリック。
ウィジェット名のところにホームページ名（お好きな名前でも可）を入力します（図中①）。
続けてホスト名を追加するをクリックします（図中②）。
右側に開いたウィンドウの「カスタムホスト名を追加する」にホームページのドメイン名（例：wh-kochi.com）を入力して追加ボタンをクリックします。
下にスクロールすると入力したドメインが表示されているので、チェックを入れてから、追加ボタンをクリックします。
ホスト名にドメイン名が表示されます。
「ウィジェットモード」は「管理された」のままで問題ありません。
画面右下の作成するボタンをクリックします。
「サイトキー（図中①）」と「シークレットキー（図中②）」の2つが発行されます。
この後WordPressにこの2つを入力するので、メモ帳などを開いてコピーして控えておきましょう。
※「クリックしてコピー」というところをクリックするとコピーできます。
WordPress管理画面に戻り、左サイドメニューのWPFormsから設定をクリックします。
「CAPTCHA」タブをクリック（図中①）し、「Turnstile」（図中②）をクリックします。
先ほどコピーして控えておいたサイトキーとシークレットキーをそれぞれ貼り付け、「設定を保存」をクリックします。
「設定は正常に保存されました」と表示されます。
画面を下にスクロールすると「プレビュー」でCloudflare Turnstileが表示されていれば、キーの設定は完了です。
キーの設定が完了したので、お問い合わせページにCloudflare Turnstileが表示されるように設定します。
サイドメニューの「WPForms」の下のすべてのフォームを選び（図中①）、先ほど作成したお問い合わせフォームを選択します（図中②）。
標準フィールドの中に「Turnstile」が追加されているので、それをクリックします。
「無効化になっています」という旨のメッセージが表示されますが、そのままOKボタンをクリックします。
フォームの右上に「Turnstile有効」と表示されていれば設定完了です。
右上の保存ボタンをクリックして、保存します。
保存できたら、右上角の「×」をクリックしてこの編集画面を終了させます。
ブラウザでお問い合わせページを確認すると、フォームの中にターンスタイルの認証ボックスが表示されるようになりました。
送信テストで確認
フォームを固定ページに設置して公開したら、すぐに運用を始める前に、必ず、自分でテスト送信をしましょう。
お問い合わせは、お客様の個人情報を扱いますし、お客様との大事な架け橋です。お問い合わせフォームを作成しても、正常稼働していなかったら元も子もありません。
設定上は問題なさそうでも、実際にフォームを送信してみると「メールが届かない」「迷惑メールフォルダに入ってしまっている」といったことが起きることがあります。公開後に気づくより、この段階で確認しておくほうが安心です。
送信ボタンをクリックしたあと、「お問い合わせありがとうございます」のメッセージが表示されれば、フォーム自体の動作は問題ありません。
すずのりただし、ここからが大事です。確認しておきたいポイントは次のとおり。
- フォームに必要事項を入力して、実際に送信できるか
- 管理者宛のメールと、お問い合わせをした人へのメールが、それぞれ正しく届いているか
- 届いたメールが、迷惑メールフォルダに入っていないか
- メールの件名・本文の内容が、意図した通りになっているか
特に気をつけたいのが、迷惑メールフォルダへの振り分けです。
送信元メールアドレスにホームページのドメインと異なるアドレスを使っている場合、受信したメールに警告が表示されたり、迷惑メールフォルダに入ってしまったりすることがあります。
お問い合わせした人が確認メールに気づかないケースもあるので、お問い合わせページに「確認メールが届かない場合は、迷惑メールフォルダもご確認ください」の一文を添えておくと親切です。
固定ページの一覧から「お問い合わせページ」を開き、フォームの直前の段落にその文章を追加して保存しておきましょう。
なお、通知設定の送信元メールアドレスをWordPressのドメインに合わせておくと、受信トレイに届きやすくなります。
まとめ：入口を整えておきましょう
お問い合わせページは設定する項目が多く、ここまで読んで「ちょっと大変そうだな」と感じた方もいるかもしれません。
でも、ひとつずつ慎重に順番に進めていけば、形になっていきます。
お問い合わせフォームは、ホームページを訪れた方が、仕事の相談を気軽に伝えられる窓口。まずは、ここまでの設定を済ませて、フォームを置いてみるところから始めてみましょう。
お問い合わせフォームを作ったら、次はプロフィールやサービスページなど、ホームページ全体のページも整えていきましょう。