「Contact Form 7」というプラグインでお問い合わせフォームを作成したいです!
お問い合わせフォームの作成の仕方と設置方法を教えてください!
こんな疑問を解決します!
お問い合わせフォームを設置しておけば、読者からの質問や企業からの広告掲載依頼を受け取ることができます。
本記事を読めば、10分程度で以下のようなお問い合わせフォームを設置することができますよ!
\当ブログテーマ/
もくじ
お問い合わせページの作成方法|Contact Form 7
それではさっそくお問い合わせフォームを作成していきましょう。
手順①:Contact Form 7のインストール・有効化
まずはWordPress管理画面で、「プラグイン」→「新規追加」をクリックします。
検索窓に「Contact Form 7」と入力し、「今すぐインストール」をクリックします。
インストールできたら「有効化」をクリックします。
有効化しただけではまだお問い合わせフォームは作成されません。
次の手順でお問い合わせフォームを作成していきます!
手順②:コンタクトフォームを作成
まずはサイドメニューで「お問い合わせ」→「新規追加」をクリックします。
コンタクトフォーム追加画面でタイトルにわかりやすい名前を入力し、何も設定は変更せず「保存」をクリックします。
保存すると、ショートコードが表示されるので、コピーします。
コードをクリックして「Ctrl(macの人はcommand) + C」でコピーができます!
手順③:お問い合わせページを作成
コードをコピーできたら、サイドメニューの「固定ページ」→「新規追加」をクリックします。
固定ページの新規追加面で、以下のように操作していきましょう。
- タイトルに「お問い合わせ」と入力
- 「+」をクリック
- 検索窓に「ショートコード」と入力
- 「ショートコード」をクリック
コピーしたショートコードを張り付け、パーマリンクを適当な英数字に変更後、「公開」をクリックしましょう。
上記で解説したのはブロックエディタ(グーテンベルク)でのやり方ですが、クラシックエディタでもほぼ同じ方法で作成することができます。
クラシックエディタでは、ショートコードを本文に直接貼り付けるよ
お問い合わせフォームの設置方法
お問い合わせページまで作成できましたね!
ただ、サイトの表面上に表示されているわけではないので、このままでは読者や企業がお問い合わせページまでたどり着くのが困難な状態です。
そこで、サイトの表面上にお問い合わせページへのボタンを設置しましょう。
まず、サイドメニューで「外観」→「メニュー」をクリックします。
ここからは、「作成済みのメニューでお問い合わせフォームを設置する人向け」と「新しくメニューを作る人向け」に分けて説明します。
作成済みのメニューでお問い合わせフォームを設置する人向け
以下の手順で「お問い合わせ」をメニューに追加しましょう。
- 任意のメニューを選択
- 「選択」をクリック
- 「お問い合わせ」にチェック
- 「メニューに追加」をクリック
「お問い合わせ」が追加されたことを確認し、「メニューを保存」をクリックしましょう。
新しくメニューを作る人向け
まず、以下の手順で新しいメニューを作成しましょう。
- 「新しいメニューを作成しましょう。」をクリック
- 任意のメニュー名を入力
- 任意のメニュー設定にチェック
- 「メニューを作成」をクリック
メニュー名はサイトの表面上には表示されないので、自分で分かりやすい名前を付けましょう!
メニューが作成できたら、「お問い合わせ」にチェックし、「メニューに追加」をクリックします。
「お問い合わせ」が追加されたことを確認し、「メニューを保存」をクリックしましょう。
これでお問い合わせフォームの設置は完了です!
実際に自分のサイトを確認してみましょう。
ヘッダーに「お問い合わせ」が表示され、クリックするとお問い合わせページが表示されればOKです!
実際にお問い合わせフォームからメールを送信して、登録されたメールアドレス宛に届くか確認してみてもよいでしょう。
ちなみに、お問い合わせメールが届くメールアドレスは、サイドメニューの「設定」→「一般」をクリックし、
一般設定画面の『管理者メールアドレス』で確認することができますよ。
このままでもお問い合わせフォームの機能としては充分ですが、次章でもっと利便性を上げる方法をご紹介します!
お問い合わせフォームの利便性を上げる
もうお問い合わせフォームとしては使える状態になっていますが、さらに利便性を上げる方法をご紹介します。
それがこの2つ。
- 自動返信メールを設定
- スパム(迷惑)メール防止
順番に解説していきます!
①:自動返信メールを設定
自動返信メールとは、お問い合わせフォームを送信してくれた読者や企業に対して、自動でメールを送信してくれる機能です。
自動送信メールの本文に送信を感謝する文章や対応が遅れる可能性がある旨を記載しておけば、相手への印象がよくなるというメリットがあります。
とはいえ強制ではないので、設定したい方だけ以下の手順で設定しましょう!
まずは、コンタクトフォームの編集画面で「メール」をクリックします。
メールを下にスクロールし、以下の操作を行いましょう。
- 「メール(2)の使用」にチェック
- 『題名』を任意の文に変更
- 『メッセージ本文』に任意の文を追加
ちなみに僕は『題名』に、
【この度はお問い合わせいただきありがとうございます】
『メッセージ本文』に、
---------------------------------------
この度はお問い合わせありがとうございます。
折り返しご連絡させていただきますが、数日お時間を頂く場合がございます。
何卒ご了承くださいませ。
と入力しています。
入力ができたら、「保存」をクリックしましょう。
これで自動送信メールの設定は完了です!
実際にお問い合わせフォームからテストメールを送信し、入力したアドレス宛にメールが届くか確かめてみましょう!
②:スパム(迷惑)メール防止
セキュリティ対策をせずにお問い合わせフォームを設置していると、スパムメールが届くことがあります。
そこで、スパムメールを防止する「reCAPCHA」というセキュリティ対策を行い、スパムメールの量を減らしましょう。
「reCAPCHA」の設定にはGmailが必要になるので、Gmailを設定していない方は以下のリンクから設定しましょう。
Gmailを設定できたら、「reCAPCHA」の設定をしていきましょう。
まずは、「reCAPCHA」の公式ページにアクセスします。
サイト上部の「v3 Admin console」をクリックします。
Googleログイン画面でGmailアドレスまたは電話番号を入力し、「次へ」をクリックします。
パスワードを入力し、「次へ」をクリックします。
すると、reCAPCHAのサイト登録画面が表示されるので、各項目を以下のように操作します。
- ラベル:わかりやすい名前を入力
- reCAPCHAタイプ:『reCAPCHA v3』を選択
- ドメイン:サイトドメインを入力
- 『reCAPCHA利用条件に同意する』:チェックを付ける
- 『アラートをオーナーに送信する』:チェックを付ける
- 「送信」をクリック
送信ができたら、以下のような『reCAPCHA登録完了画面』に遷移するはずです。
後ほど「サイトキー」と「シークレットキー」は使うので、画面はそのままにしておいてください。
(別ブラウザで)WordPress管理画面にて、
「お問い合わせ」→「インテグレーション」をクリックします。
下にスクロールすると『reCAPCHA』項目があるので、「インテグレーションのセットアップ」をクリックします。
reCAPCHA設定画面で、先ほどのサイトキーとシークレットキーを入力し、「変更を保存」をクリックします。
これで『reCAPCHA』の設定は完了です!
サイトの画面右下に『reCAPCHA』が表示ざれているか確認してみてください。
まとめ:お問い合わせフォームを作成し、メッセージを受け取る準備をしよう
お問い合わせフォームを設置しておくと、読者からコメントや質問が来たり、企業から依頼が来たりすることがあります。
機会損失にならないように、あらかじめ設置しておくことをおすすめします。
プラグインについてもっと知りたいという方は以下の記事をどうぞ!