Contact Form 7の設定と使い方:お問い合わせページの作成

Contact Form 7

プラグインContact Form 7の設定と使い方をまとめておきます。

このプラグインを使うと、ショートコードで簡単にお問合せページを作成することができます。

目次

設定と使い方

プラグインを有効化すると、管理画面に「お問い合わせ」が追加されます。

後は、ショートコードを任意のページに貼り付けるだけです。

お問い合わせのショートコード

ブロックエディターの場合は、専用ブロックから挿入することもできます。

「Contact Form 7」専用ブロック

ショートコード及び専用ブロックを挿入できたら、お問い合わせページの作成は完了です。

お問い合わせページ

ページを開いて問題なく表示されていることを確認して下さい。

特に編集やカスタマイズが必要なければ、お問い合わせページの設置は完了です。

自動返信メールの設定

お問い合わせ管理画面を開いて、コンタクトフォームの「編集」をクリックします。

コンタクトフォームの編集

上端タブのメール項目を開いて、ページ下部の「メール(2)」にチェックを入れます。

自動返信メールの設定

これでメッセージが送信された際に相手に自動返信してくれます。

reCAPTCHA (v3)

reCAPTCHAインテグレーションモジュールを使えば、スパムボットによる不正なフォーム送信を遮断できます。

登録と設定

MyreCAPTCHAの登録フォームを全て入力して、「送信」をクリックします(Googleアカウントが必要)。

reCAPTCHAの登録

表示された「サイトキー(公開可能キー)」と「シークレットキー」をコピーします。

サイトキー(公開可能キー)とシークレットキー

WordPressに戻って、reCAPTCHAの「インテグレーションのセットアップ」をクリックします。

reCAPTCHAインテグレーションモジュール

先程の「サイトキー」と「シークレットキー」を入力して、「設定を保存」をクリックしたら設定完了です。

reCAPTCHAに「サイトキー」と「シークレットキー」を入力

reCAPTCHAのロゴ(バッジ)を非表示にする

お問い合わせページに下記の内容を表記すれば、reCAPTCHAのロゴを非表示にすることが許可されています。

コードをコピーして、お問い合わせフォームの一番下に貼り付けます(視認できる場所ならどこでもOK)。

eCAPTCHAのロゴ(バッジ)を非表示

次に、ロゴを非表示する下記CSSをカスタマイザーの「追加CSS」に追加します。

ロゴ(バッジ)非表示のコードを追加

画面右下のreCAPTCHAのロゴが非表示になれば設定完了です。

Frequently Asked Questions  |  reCAPTCHA  |  Google Developers

最後に

もっと細かくカスタマイズすることもできますが、個人的には「自動返信メールの設定」と「スパムボットによる不正なフォーム送信の遮断」だけでも十分だと思います。必要であれば、ご自身で編集して下さい。

最後に、コンタクトフォームを編集した後は、メールが問題なく送信されるか必ずテスト送信して下さい。

コメント

コメントする

目次