以前の記事でWordPressの『問い合わせフォーム』について書いていきました。
この『問い合わせフォーム』は外部のサービスと連携することでコンタクトフォームの可能性が広がることをご存じでしたか？
今回はWordPress外部サービスであるGoogleリキャプチャ(reCAPTCHA)について解説をしていきたいと思います！
Googleリキャプチャ(reCAPTCHA)
Googleリキャプチャ(reCAPTCHA)とは
reCAPTCHA はGoogleが提供しているサービスのことで、スパムやその他の自動化された嫌がらせから守ってくれる機能の事です。
Googleリキャプチャ(reCAPTCHA)の役割とは
お問い合わせフォームの送信画面やログイン画面で、「私はロボットではありません」の文言とともに表示されるチェックボックスを見たことがある方は多いのではないでしょうか。
『Contact Form 7』のGoogleリキャプチャ(reCAPTCHA)インテグレーションモジュールを使えば、botによるWebサイトへの攻撃を防ぐことが可能です。
受信者の意向を無視して一方的に繰り返し送られる迷惑メールのことを指します。
以前、アメリカの食肉加工会社が豚肉の缶詰「SPAM」の名称を何度も連呼するCMを放送していたことから、しつこく送りつけられる迷惑メールのことを「スパム（Spam）メール」と呼ぶようになったそうです。事前の同意がない広告・宣伝メールは、「特定電子メールの送信の適正化等に関する法律」や、「特定商取引に関する法律」により、原則的に禁じられています。
それにも関わらず、しつこくスパムメールが送付される理由は送信者にメールアドレスが知られているからです。
そうなった原因としては、無料サービスにメールアドレスを登録した際に流出した事例や、送信者側がメールアドレスのランダム生成機能を利用して送信に成功してしまった事例などが考えられます。
スパムメールにはさまざまな種類があり、単純に広告・宣伝目的のもの、フィッシングサイトや出会い系サイトへの誘導を目的としたもの、さらにウイルスの配布や個人情報流出を狙いとしたものなどがあります。引用：危険な「スパムメール」とは？正しい対処法と対策
サイト運営をする際は、ユーザーとのやり取りの為に必ず『問い合わせフォーム』の設定をしておきましょう（WordPressの場合無料なので必須ですね！）
問い合わせフォームの作成方法はこちら
Googleリキャプチャ(reCAPTCHA)登録
それではGoogleリキャプチャ(reCAPTCHA)を登録していきましょう
Step1:reCAPTCHAにアクセス
以下リンクを貼り付けましたのでGoogle reCAPTCHAのサイトにアクセスをしていきましょう
Step2:情報登録
『v3 Admin Console』をクリック
次に詳細情報を登録していきます
チェック箇所・入力内容は以下を参考にしてみてください
| 項目 | 説明 |
|---|---|
| ラベル | なんでもOK |
| reCAPTCHAタイプ | reCAPTCHA v3を選択します |
| ドメイン | ご自身のサイトドメインを記載でOKです (https://以降を入力しましょう) |
| オーナー | ご自身のアドレスを登録していただけばOK |
| reCAPTCHA 利用条件に同意する | をいれます |
| アラートをオーナーに送信する | サイトに問題が起きた際、アラートを受け取る場合はをいれます |
上記の通りに入力し送信をクリックします
Step3:サイトに reCAPTCHA を追加
サイトに reCAPTCHA を追加していきます
まず以下の2つのキーをコピーします(サイトキー、シークレットキーの2つは以下の工程で使いますので控えておきましょう)
次にWordPress管理画面⇒問い合わせ⇒インテグレーションの順にクリックします
外部 API とのインテグレーション最下部に『reCAPTCHA』の選択項目があるので『インテグレーションのインストール』をクリック
先ほどメモをしてもらった『サイトキー』『シークレットキー』を入力します
入力が完了したら変更を保存をクリックします
Googleリキャプチャ(reCAPTCHA)確認
以下の位置にリキャプチャ(reCAPTCHA)が表示されていれば設定は完了です
reCAPTCHAのマークの調整
上記で設定したreCAPTCHAのマークがマークとかぶって見ずらいかもしれません。
その場合はreCAPTCHAのマークを『非表示にする』か『位置をずらす』ことが可能です
reCAPTCHAのマーク非表示
reCAPTCHAのマークを非表示にする場合は、以下の文言をサイトの見えるところ（下部が良いかなと思います）に表示しておくことが必要です。
This site is protected by reCAPTCHA and the Google
<a href="https://policies.google.com/privacy">Privacy Policy</a> and
<a href="https://policies.google.com/terms">Terms of Service</a> apply.
保護マークはCSSで非表示にします。
WordPress管理画面⇒『カスタマイズ』⇒『追加CSS』
もしくは
『子テーマの.style css』で下記のCSSを追記します。
.grecaptcha-badge{
visibility: hidden;
}これで保護マークが消えます。
保護マークを消した場合、保護マークに相当する文章を表記する必要があります。
お問い合わせフォームと、フッターに下記の翻訳したものを表示しておきます。
このサイトはreCAPTCHAによって保護されており、Googleの<a href="https://policies.google.com/privacy">プライバシーポリシー</a>と<a href="https://policies.google.com/terms">利用規約</a>が適用されます。reCAPTCHAのマークずらす
保護マークを消すのではなく位置をずらす場合は、CSSで位置をずらします。
以下は下から上に向かって100pxのずらした例
.grecaptcha-badge {
bottom: 100px!important;
}しっかりずれました
さいごに
以上がWordPress設定できるGoogleリキャプチャ(reCAPTCHA)の設定と登録方法・カスタム方法になります。
スパムメールで悪影響が出ないように、サイトを運営する際は必ず設定しておきましょう！
コメント