Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

メールフォームの「送信する」ボタンの前に「個人情報保護方針にチェックする」のようなチェックボックスを見たことがある人も、多いのではないかと思いますが、

WordPressのContact Form 7を使った問い合わせフォームにも、チェックボックスをクリックしないとメール送信できない仕組み(同意チェック)を入れることは可能ですので、今回はその方法をについてご紹介します。

Contact Form 7で送信ボタンの前に同意チェックボックスを設置

管理画面左メニューから「お問い合わせ」>「コンタクトフォーム」をクリックします。
Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

フォーム編集画面に進んで、
Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

パーツの中から「承認確認」ボタンをクリックします。
Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

承認確認を挿入する場所は[submit “送信”]ボタンの前です。

フォームタグ生成: 承諾確認ウィンドウが表示されるので、必要に応じて以下の項目を入力します。

承認確認の設定項目
名前フォームのname
同意条件チェックボックスの横に表示するテキスト
(例)規約に同意してチェック
オプション初期設定でチェックボックスは任意になっているで
必須にする場合はチェックを外します
ID属性フォームのID
クラス属性フォームのクラス

今回は「規約に同意してチェック」を必須にするようにしました。
これで「タグを挿入」ボタンをクリックすると、
Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

以下のようなタグが挿入されたことを確認されたら、

[acceptance acceptance-573] 規約に同意してチェック [/acceptance]

ページ下部の「保存」ボタンをクリックします。
Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

チェックボックスの挙動確認

メールフォームの画面へ進み、チェックを入れないと送信ボタンがクリックできないことを確認してください。
Contact Form 7の送信ボタンの前に同意のチェックボックスを設置する方法

関連記事

コメントを残す