WordPressの問い合わせページに確認ボックス設置でセキュリティぷち強化

ワードプレスでブログを書き始めて、やっと5ヶ月。
勉強しながら少しずつセキュリティも強化していますよ。

まだ弱小ブログですが、それなりにスパムコメントや海外からの不正ログイン試行が……。
もちろん、
『Akismet』でスパムコメントのブロック。
『WordFence』でファイアウォール。
などの、セキュリティプラグインで守ってもらっています。

ふと、思いました。
「お問い合わせページ」は無防備では?
いや、まだ、お問い合わせなどは無いけれど…、今後の為に調べておこう。
ん〜、やはり、何もしなければスパムっぽいメールでいっぱいになるらしい!
何かしなければ!!

「お問い合わせページ」に確認チェックボックスを

利用させて頂いている問い合わせ用プラグインは『Contact Form 7』。
とても有名なプラグインですね。

ワードプレスの問い合わせフォームプラグイン「Contact Form 7」

ほとんどデフォルトのままで設置していましたが、セキュリティを強化する方法がいくつかありました。

中でも一番お手軽と思われる、
『送信前に確認ボックスにチェックを入れないと送信されない』
設定を施す事にしました。

まず、ダッシュボードから『Contact Form 7』の設定編集ページに入ると、『フォーム』が開いています。
上部にフォームタグが並んでいて『承諾確認』というのが確認ボックス用ですね。

コンタクトフォーム7の設定画面

クリックするとタグ生成ページが開いて、一番下に挿入用のタグが作られているので、コピーしたら『フォーム』に戻って好きな場所にペースト。
送信ボタンの直前が、妥当な場所。
これで終了だよ〜というのが、少し前までの手順の様です。(過去の検索によるとね)

アップデートしているうちに、設定も変化しているのでしょう……。

2018年12月時点では、タグをコピー&ペーストするだけだと、チェックするかしないかは任意(どちらでも送信できる)になっています。

テストしてみて気付いたのですが、チェックしなくても送信できるんじゃ意味ないですよね……。

何がいけないのかな?
デフォルトの設定画面を良〜く見ると、「チェックボックスを任意選択にする」にチェックが入っていますね。
このチェックは外しましょう。

コンタクトフォーム7の承諾確認タグ生成画面

上記画面は任意選択なので”optional”が入っていますが、チェックを外すと消えます。
それだけの違いなのですが、初心者ブロガーは焦りますから……。
タグをコピーしたら、『フォーム』内にペーストしましょう。

これで、確認ボックスにチェックを入れないと送信できないようになりました。

送信エラー時にメッセージを出したい

まだ、気になる違和感が……。
無事に送信されたら、「送信できました」メッセージが出るのですが、送信できなかった場合のメッセージは何も無いのかな?

パソコン、スマホ、タブレットで送信テストをしたのですが、それぞれ違う挙動でした。
チェックしないで送信を押そうとしたら、
うす〜く禁止マークが出たり。←一番親切かな。
送信ボタンの反応が無かったり。←画面を見ていれば送信されていないと気付くかな。

最悪なパターンは、送信ボタンが反応している(色が変わる)のに送信できていない!
これは、「送信したのにいつまでも返事が無い」と思われかねないのでダメでしょ!!

名前やアドレスが入力されていないときは、「未入力です」や「アドレスに間違いがあります」などのメッセージが出ます。
こんなメッセージを出したいですよね。

もう一度設定を確認すると、『その他の設定』というのが怪しそうです。
『その他の設定』の中から、リンクされている『その他の設定を参照』という部分をクリックすると、ありました!
リンクで飛んだ説明ページの中にある『検証としての承認』(言葉がお固いな〜)に書かれているコードをコピーして、もう一度『その他の設定』に戻ってペーストです。

エラーメッセージを追加するコード

『その他の設定』に戻って、

エラーメッセージの追加コードを貼る場所

エラー時に出るメッセージは『メッセージ』の中の、「承諾が必要な項目が承諾されていない」という部分の編集をして、お好きな文章に変更できます。

送信テストしてみると、

お問い合わせページで送信エラー時のメッセージ画面

これで、今度こそ、求めている動作になりました。
めでたしめでたし。

これでもセキュリティが甘いと思ったら、『Akismet』と連携させてスパムをブロックしたり、画像認証『reCAPTCHA』を取り入れる方法もありますね。

まずは初心者でもお手軽にできる「お問い合わせページ」の、ぷちセキュリティ対策でした。

チェックマークを持つヤギ

スポンサーリンク
PC(大)
PC(大)

フォローする?

トップへ戻る