Elementor 用の最も柔軟なフォーム ビルダーである MetForm は、最も多くの機能を備えたユーザー フレンドリーなお問い合わせフォームを最も速く構築する方法です。ドラッグ アンド ドロップお問い合わせフォーム ビルダーに付属する、高品質のあらかじめ構築された Web デザイン レイアウトを使用して、視覚的に魅力的なフォームを構築できます。
MetFormプラグイン Google reCAPTCHA と統合することで、ウェブサイトをスパムや不正使用から保護するオプションが提供されます。この reCAPTCHA WordPress プラグインを使用すると、Elementor フォームに reCAPTCHA を簡単に追加できます。MetForm を使用して WordPress に reCAPTCHA を追加する方法については、このドキュメントをお読みください。
Elementorフォームに条件付きフィールドを追加する方法についてのビデオガイドをご覧ください
ステップ1: GoogleからreCAPTCHA (v2)サイトキーとシークレットキーを生成する #
まず、に行きます Google reCAPTCHA ページ サイトに新しい reCAPTCHA サイト キーとシークレット キーを作成します。ページで次の操作を行います。
1.1 タイプa ラベル サイトの。
1.2 選択する reCAPTCHAタイプここでは reCAPTCHA v2 を選択しました。
1.3 追加する ドメイン あなたのサイトの。
1.4 (所有者の) 電子メールアドレス.
1.5 受け入れる reCAPTCHA利用規約.
1.6 クリック 提出する ボタン。
1.7 次のページでは、 サイトキー そして 秘密鍵 reCAPTCHA 用です。後で使用するためにコピーしておいてください。
ステップ2: MetformにreCAPTCHAを追加する #
Metform に reCAPTCHA を追加するには:
2.1 移動 Metform > 設定 > 一般 WordPress ダッシュボードから。
2.2 reCAPTCHAのバージョンを「reCAPTCHA V2」に選択します。
2.3 コピー&ペースト サイトキー そして 秘密鍵 それぞれのフィールドに入力します。以前にキーを生成していない場合は、クリックして今すぐ生成できます。 ここから作成 畑の下で。
2.4 をクリックして 変更内容を保存 右上隅にあるボタンをクリックします。
ステップ3: ElementorのフォームにreCAPTCHAを追加する #
フォームに reCAPTCHA を追加するには:
3.1 新しいフォームを作成するか、Elementor エディターでフォームを開きます。
3.2 見つける reCAPTCHAウィジェット エディターパネルからデザインにドラッグします。
注記- MetForm デモのうち 2 つは reCaptcha フィールドを使用して設計されています。それらは、Simple contact form 1 と Simple contact form 2 です。空のデモまたは別のデモの場合は、reCaptcha ウィジェットをドラッグ アンド ドロップして操作する必要があります。
3.3 追加のクラス名を追加する、Recaptcha のラッパーに新しいクラスを追加して、そのクラスにカスタム CSS / JS を追加できるようになります。
3.4 をクリックして アップデート プロセスを完了するためのボタン。
3.5 最後に、reCAPTCHAのプレビューを プレビューページ.
[注: reCAPTCHA プレビューはエディターでは使用できません。 reCAPTCHA はプレビュー ページに表示されます。]
reCAPTCHA の適用 (v3) #
reCAPTCHA v3 を適用するには、ステップ 1 から始める必要があります。まず、v3 の 2 つのキーを生成します。次に、ステップ 2 に進み、v3 を選択して、キーをコピーして貼り付けます。
今すぐフォームのプレビューを確認してください –
上記の手順に従うと、MetForm reCAPTCHA WordPress プラグインを使用して、Elementor に reCAPTCHA を簡単に統合できます。