WEBLIC LLC

ブログ

WordPressのContact Form 7にキャプチャを導入する方法

Web制作

2017年1月12日

昨年末あたりからWEBLICのサイトのお問い合わせフォームからちょくちょくスパムが届くようになり困ったので、今回は人間かロボットかを判別するキャプチャを導入することにしました。

まず、今までのお問い合わせフォームはSmartyで作ったフォームでしたが、古いため今回のキャプチャ導入を機にWordPressのContact Form 7に移行しました。

あらかじめContact Form 7にはキャプチャの機能が備わっていたので、すごく簡単に導入することがでます。

WordPress、Contact Form 7以外で準備するものはGoogleのreCAPTCHAを使うためのサイトキーとシークレットキーになります。

https://www.google.com/recaptcha/admin#list
こちらからキーを発行してください。


※GoogleのreCAPTCHAの画面

こちらで、サイトキーとシークレットキーを発行します。まずLabelとDomainsに必要な情報を入力してください。
Labelは任意の文字列で構いません。Domainsはキャプチャを使うドメインを入力しいます。複数ある場合は改行して入力します。(1行に1ドメインとなります。)

入力が完了するとサイトキーとシークレットキーが発行されます。

Google reCAPTCHAでの作業は以上なので、次にWordPressの管理画面に移動します。

Google reCAPTCHAで発行したサイトキーとシークレットキーを「インテグレーション」から登録します。
※画面はすでに登録済みの画面です。

「インテグレーション」で設定を終えたら最後にContact Form 7の設定画面に戻り、キャプチャを表示させたい場所に「reCAPTCHA」のボタンをクリックして挿入します。

上記は実際に実装した画面になります。

このように今回は簡単にキャプチャ機能を実装することができました。

関連記事

Web制作

メイリオフォントはCSSでイタリックが効かない!

先日ある案件でデバイスフォントを斜体にする必要がありました。普段は何も気にせずCSSでイタリックを設...

2017年4月3日

Web制作

コーディングを効率化するEmmetはすごく便利!

10数年前からコーディングに携わっていたボクは、ずっとDreamweaverを愛用していましたが、こ...

2016年11月4日

Web制作

GoogleドキュメントOCRの力でサイト制作効率アップ!

こんにちは、丹羽です。サイト制作する際に、クライアントから支給された原稿がデータ化されていない場合や...

2023年7月20日

Web制作

オリジナアイコンを簡単にWEBフォントにする方法

ここ数年スマホからのアクセスの割合がPCを超えているサイトが多くなっています。そこで、スマホサイトを...

2016年10月19日

Web制作

JavaScriptで作られたページはGoogleにインデックスされるの?

Google検索エンジンはどこを見ているの?ソースとDOMの違いWebページには"ソース"と"DOM...

2024年11月7日

  • カテゴリー

  • 本日、 2人が閲覧しました

    RELATED SITES

    関連サイト

    • SAKAMOTO Blog
    Designed by WEBLIC合同会社