contact form7の承諾確認ボタン利用方法

WordPressで問い合わせフォームを作成する際によく利用されるコンタクトフォーム7。入力フォームと送信ボタンだけで作成すると大量のスパムメールが送信されます。(実際に送信されたことがあります)

スパムメール対策を簡単に行うために承諾確認ボタンというものがあります。本記事では承諾確認ボタンの役割と利用方法について説明します。

承諾確認ボタンとは

承諾ボタン配置場所

承諾確認ボタンとはコンタクトフォーム7で提供されているフォームです。

利用方法

利用方法としては、お問い合わせ画面にて問い合わせフォームに入力後送信ボタンを押下する前に送信することを確認するためのチェック項目となります。

画像ではわかりにくいですが、送信ボタンは押下不可です。
画像ではわかりにくいですが、送信ボタンは押下可です。

承諾確認ボタンを設置する目的

スパムメール対策

コンタクトフォーム7はスパムメール送信のターゲットとなりやすいプラグインです。reCAPTCHAなどを利用することでスパムメール対策は可能となりますが、機械的な送信処理対策として一番簡易的なものとなります。

ユーザへの確認事項

個人情報の取り扱いや入力時の確認事項としてユーザに対して意図的な入力を促す項目となります。あらかじめ承諾を得てから利用してもらうために項目を設置し、入力フォームを送信するためにはチェック入力が必須となります。

フォームのチェックボックスでも似たようなことを行えますが、チェックボックスフォームでは一度送信ボタンを押下してから必須入力エラーとして表示することとなります。

承諾確認フォームではチェックが入らないと送信ボタンそのものが押下不可となります。

承諾確認ボタンにリンクを設置

上記のようにユーザへ確認させたい内容が大量となる場合は別ページへのリンクを設置し、クリックすることで別ページが表示されるような仕組みにすることが可能です。その場合のソースは以下の通りです。

[acceptance acceptance-5xx] <a href="https://www.xxxxx.com/privacy/" target="_blank">当社の個人情報保護方針</a>に同意する場合はチェックを入れてください。[/acceptance]
入力フォームから「承諾確認」ボタンを押下

承諾確認ボタンを押下すると別ウィンドウが表示されます。

①名前:自動採番されるものをそのまま利用しても問題ありません。任意で変更してください。

②同意条件:チェックボックス右に表示される文言を入力してください。例:当社の個人情報保護方針に同意する場合はチェックを入れてください。

③オプション:任意入力とする場合はチェックを入れます。任意にするとスパム対策にはなりません。

④ID属性:任意入力

⑤クラス属性:任意入力

リンクを設置

同意条件に入力した文言が表示されるのでアンカータグを使ってリンクを設置します。

[acceptance acceptance-5xx] <a href="https://www.xxxxx.com/privacy/" target="_blank">当社の個人情報保護方針</a>に同意する場合はチェックを入れてください。[/acceptance]

赤字部分がアンカータグになります。hrefの後ろにはリンク先のURLを設置してください。target=”_blank”は別ウィンドウを表示するという意味になりますので同一ウィンドウで表示する場合は該当箇所を削除してください。

承諾確認ボタン前に表示

別ページではなく同一ページに表示するケース

個人情報保護方針や個人情報の取り扱いなど別ページではなく同一ページに記載する場合は承諾確認ボタンの前にテキストエリアを使って本文を記載することも可能です。別ページにすると基本的に読まれないことが多いので重要事項などユーザに読んでほしい内容であれば同一ページに記載した方が読まれやすくなります。

その場合は以下のソースをコンタクトフォーム7のフォーム編集内に記載してください。

<div class="scroll-box" style="width:100%; height:200px; overflow-y: scroll; border: 1px solid #ddd;background-color:#f8f4f4;">

<u><b>■個人情報保護方針</b></u>
<p class="bs">〇〇(以下、当社)は~<本文を記載、以下略></p>
</div>

heightでテキストエリアの高さを調整してください。

コンタクトフォーム7のダウンロードはこちらから

まとめ

コンタクトフォーム7の承諾確認ボタンの利用方法はいかがでしたでしょうか。承諾確認はスパムメール対策やユーザに事前確認しておきたいことなどで利用されます。入力フォームは原則入力しやすいフォームをユーザへ提供することでCV率が向上すると言われています。承諾確認はユーザにチェックを入力してもらうという一手間が入る分ユーザリビティがやや低下します。

また承諾確認をチェック入れずに送信ボタンが押せず、対処法もわからないまま離脱してしまう可能性もあります。

承諾確認はあれば便利でありつつ、本当に必要なもの以外で設置するとCV率に影響がでますので設置する際には目的を明確にしたうえで設置することをオススメします。