【Tips】Web制作者必須!! Contact Formを設置したら迷惑メールがたくさん来るのでreCAPTCHAを設定してみました

WordPressのContact Formで

お問い合わせページを設置するとスパムが

大量に届くのでreCAPTCHAを設定。

対処しておかないと迷惑メールだらけに。

contactform11

Contact FormでreCAPTCHAの設定方法

contactform1

コンタクトフォームのメニュー内にある

インテグレーションを開きます。

(警告やバージョンが古かったのでこの後更新しています。)

contactform2

reCAPTCHAの項目があるので

インテグレーションのセットアップをクリックします。

contactform3

サイトキーとシークレットキーが必要なので

詳しくはreCAPTCHAのリンクを新しいタブで

開きます。

contactform4

画面内のRegistering a siteの所の

My reCAPTCHAをクリックします。

contactform5

使うサイトの情報を入力します。

ラベルは自分が管理しやすい名称を入力します。

次にreCAPTCHA v3を選択します。

ドメインですがContact formを使うサイトの

ドメインを入力します。

このブログだと「pc.mogeringo.com」となります。

このドメイン指定を間違うと正常に動作しないので

しっかり確認します。

次に現在ログインしているGoogleアカウントに

紐づいているメールアドレスが表示されています。

利用条件に同意するにチェックして送信をおします。

contactform6

もう一つのブログMissionViewerのお問い合わせに

設定をしてみました。

contactform7

送信を押すとサイトキーとシークレットキーが

表示されるのでWordpressの管理画面で

このキーを入力します。

contactform8

ちゃんと貼り付けたら変更を保存を

クリックします。

contactform9

有効化されています。

と表示されれば設定は完了です。

contactform10

お問い合わせページにこんな表示が出れば

正常に動作していますが、

どのページにもこの表示が出てしまいます。

その場合の対処にこれが表示されないように

するプラグインなどがありますが、

あまり多くのプラグインを導入するのも嫌なので

CSSだけで実装してみました。

【reCAPTCHAマークを必要な場所だけ表示する方法】

contactform12

お問い合わせページのpost-idを確認します。

固定ページからお問い合わせページの編集を

開くとURLスラッグとは別にWordpress上の

PostIDがURLを確認すると表示されています。

私の場合はpost=60という事で

60がお問い合わせページのIDとなります。

contactform13

カスタムCSSや追加CSSなどテーマ上に

下記のCSSを追加します。

.grecaptcha-badge {
visibility: hidden;
}

.page-id-60 .grecaptcha-badge {
visibility: visible;
}

これでIDの部分は実施のWordpress環境に

合わせて変更します。

これでお問い合わせページだけreCAPTCHAマークが

表示されるようになります。

reCAPTCHAを設定してみてスパムは減るのか

先ほど設定してみたので効果の程は分かりませんが、

その後経過してみて様子を見てみたいと思います。

最近ではURL添付なども多くなり、

こういうスパムは極力排除したいものです。

またWeb制作などクライアントに納品する場合には

必要な作業になるかも知れません。

  • コメント: 0

自分で穴埋め問題をWeb上で作成、学習できるWebサービス 『テストメーカー』前のページ

日本全国のネットラジオが視聴可能なWebサービス 『ListenRadio』次のページ

関連記事

  1. Tips

    Amazonからの怪しいメール!! フィッシング詐欺にご注意!!

    私のGmail宛に届いたAmazonからのメール。確認しないと24…

  2. Tips

    使わないともったいない!! Windows標準のクリップボード履歴がシンプルで使いやすい

    Windows10の知られざる便利機能のクリップボード履歴。今まで…

  3. Tips

    【Tips】リモートデスクトップで「CTRL+ALT+DELETE」を送信する方法

    Windows標準のリモートソフト「リモートデスクトップ」では…

  4. Tips

    Microsoftフォトがフリーズ!? 固まって画像が開かない場合の対処方法

    Windows標準のアプリ、Microsoftフォトですが最近画像…

  5. Tips

    【Tips】Windows10 タスクバーの天気予報やニュースを非表示にしてスッキリする方法

    Windowsの更新によって突然タスクバーに天気予報やニュース…

  6. Tips

    計画停電(輪番停電)に向けてのPCやサーバの準備 データ保護やPC保護に向けて

    予め分かっている停電なのでPCの保護に向けての準備・対策を 私の経験…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

こんな人が書いてます

子供のころからパソコンや電子機械が好きでコンピュータ専門学校を卒業後にIT関連企業に勤めております。

企業や個人のネットワーク構築やパソコントラブル対応、ホームページ制作、システム開発などITに関する仕事を数多く対応しています。

Twitterでこのブログの投稿や日々の出来事などをつぶやいています。Twitter:@mogeringo

最近の記事

PAGE TOP