WordPressで人認証付きお問い合わせフォームを作る

お問い合わせフォーム用のプラグイン「Contact Form 7」
をインストールしてWordPressに簡単なお問い合わせフォームを作成し
またスパム防止用にreCAPTCHA(旧私はロボットではありません認証)を加えます。

reCAPTCHAのキーを取得

まずは、Googleの無料サービスreCAPTCHAが使えるようにキーを取得します。

Googleにログインした状態で、

Sign in - Google Accounts

をアクセスします。
(アクセスした後ログインも可)

Labelには、
サイト名:設置ページ名
(区別が付くような任意の文字列)

Choose the type of reCAPTCHAは
reCAPTCHA v3を選択

Domainsは、
サイトのドメイン名

Accept the reCAPTCHA Terms of Serviceに
チェック

Send alerts to ownersに
チェック

「Register」をクリックします。

これでreCAPTCHAの
SiteKey、SecretKeyとスニペット2個を取得できました。

html ヘッダー部分に取得したスニペットを挿入する

WordPressのメニューから
「外観」の「テーマの編集」をクリックします。

初めて「テーマの編集」をする場合は、
注意!メッセージが表示されるので
「理解しました」をクリックします。

子テーマ(Cocoon Child)の
head_insert.phpファイルにGoogleから取得した
スニペット2個を貼り付けます。
「ファイルを更新」をクリックします。

Contact Form 7でお問い合わせフォーム作成

次に、お問い合わせフォームを作成します。

Contact Form 7のインストール

WordPressのメニューより
「プラグイン」の「新規追加」をクリックします。

「プラグインを追加」ページで
「Contact Form 7」を検索して
「今すぐインストール」をクリックします。

「Contact Form 7」をインストールしたら
「有効化」をクリックします。

これで「Contact Form 7」をインストールのインストールが完了し
WordPressのメニューに「お問い合わせ」と言う項目が増えました。

reCAPTCHAの設定

WordPressのメニューより
「お問い合わせ」の「インテグレーション」をクリックします。

「他のサービスとのインテグレーション」ぺーじから
reCAPTCHAの「インテグレーションのセットアップ」をクリックします。

先程Googleより取得したreCAPTCHAの
SiteKey、SecretKeyを入力後
「変更の保存」をクリックします。

お問い合わせフォームの設定

WordPressのメニューより
「お問い合わせ」の「新規追加」をクリックします。

「コンタクトフォームを追加」ページが開きます。

作ろうとしているお問い合わせフォームの題名を入力します。

フォームの項目を任意に変えることが出来ます。

基本このままで使えると思いますが、
必要に応じて変更してください。

メールタブでは、お問い合わせ内容をメールで発信する際の設定ができます。
ほとんど、変更しなくても自動で設定されいますが、
これも、必要に応じて変更してください。

入力が終わったら「保存」をクリックします。

お問い合わせページ作成

コンタクトフォームのショートコードのコピー

WordPressのメニューより
「お問い合わせ」の「コンタクトフォーム」をクリックします。

コンタクトフォーム一覧から該当するフォームの
ショートコードをコピーします。

固定ページでお問い合わせページを作成

WordPressのメニューより
「固定ページ」の「新規追加」をクリックします。

「新規固定ページを追加」ページで
タイトルを適当に入力します。
ビジュアルエディターをテキストモードにして
先程コピーしたコンタクトフォームの
ショートコードを貼り付けます。

「公開」をクリックします。

今作った新規固定ページのパーマリンクをクリックします。

実際の問い合わせページが表示されました。
このページは、固定ページなのでどこからも呼ばれない状態です。

このページのURLをコピーして、使用目的に応じてメニュー、フッターメニュー、サイドバー等からリンクさせればOKです。

また、ページ右下に下記のマークが表示されていれば、
reCAPTCHA v3の設定が正常である証です。

reCAPTCHA v3は、「私はロボットではありません」の
チェックボックスは表には表示されません。

問い合わせフォームは、自分のメールアドレスを晒さなくて済むと言う利点があります。
メールの内容もある程度フォーミングされて送られてくるので受信メール管理するのが楽になります。
reCAPTCHAを組み込んだのでロボットによるスパムメールも排除されるので安心です。