AIサマリー
ユーザーがフォームを送信する前に、単一行テキストフィールド内の特定の単語をブロックしませんか？デフォルトでは、WPFormsのスパム対策はフォーム送信時に作動します。小さなJavaScriptスニペットを追加するだけで、リアルタイムのキーワードブロックリストを実装でき、制限された単語が入力された瞬間にエラーメッセージを表示できます。
このチュートリアルでは、その使用方法を説明します。 wpforms_wp_footer_end そしてjQuery Validateを使用して、入力マスクと同様の動作をするクライアントサイドのキーワード検証を追加する。
フォームの作成
まず、フォームを作成し、キーワードブロックリストで保護したい単一行テキストフィールドを追加します。フォームに必要なその他のフィールドも追加できます。
この手順でお困りの場合は、WPFormsで最初のフォームを作成する方法に関するガイドをご覧ください。
以下の点に留意してください：
- フォームID
- 検証対象の単一行テキストフィールドのフィールドID
以下のスニペットを設定する際には、これらの値が必要になります。
コード・スニペットの追加
リアルタイムキーワードブロックリストを追加するには、以下のスニペットを使用します。この例では、`script`タグを使用してサイトのフッターに小さなJavaScriptブロックを出力します。 wpforms_wp_footer_end アクションだ。
カスタムコードの追加方法についてサポートが必要な場合は、 WPFormsにカスタムPHPまたはJavaScriptを追加する方法に関するチュートリアルをご覧ください。
このコードを追加して保存したら、フロントエンドでフォームが配置されたページにアクセスし、ブロックされた単語のいずれかを入力して単一行テキストフィールドをテストしてください。
制限キーワードが検出されるとすぐに、フォームを送信しなくても、そのフィールドの下に赤い検証メッセージが表示されるはずです。
スニペットのカスタマイズ
この例をあなたのフォームに適用するには、スクリプト上部の設定セクションを、スクリーンショットの行番号を参照して編集してください。
- フォームID
オン 14行目:var targetFormID = 100; // Replace with your Form ID
変更100シングルラインテキストフィールドを含むフォームのIDに。 - フィールドID
オン 15行目:var targetFieldID = 1; // Replace with your Field ID
変更1キーワードブロックリストを使用すべき単一行テキストフィールドのIDに。 - ブロックされたキーワード
オン 16行目:var blockedWords = ['badword', 'spam', 'unwanted']; // List of keywords to block
例示された単語を、ブロックしたいキーワードのリストと置き換えてください。必要に応じて配列から項目を追加または削除できます。 - エラーメッセージ
オン 17行目:var customError = 'This content contains restricted keywords.';
制限キーワードが検出された際にフィールドの下に表示されるメッセージを変更するには、引用符内のテキストを更新してください。
よくある質問
以下に、このカスタムキーワードフィルターの使用に関するよくある質問への回答をまとめました。
これは、スパム対策とセキュリティの組み込みキーワードフィルターとどう違うのですか？
組み込みのキーワードフィルターは、[設定] » [スパム対策とセキュリティ]で設定され、フォーム送信時にサイト上のすべてのフォームとフィールドに適用されます。このスニペットは特定の1つのフォーム上の1つの単一行テキストフィールドのみを対象とし、ユーザーが入力中に即座にエラーメッセージを表示します。
標準キーワードフィルターは、すべてのフォームで禁止語をブロックする主な方法であり、JavaScriptが無効化されている場合でも送信時に動作します。
このスニペットは、即時フィードバックが必要な重要なフィールドに対する追加のリアルタイムチェックとして最適です。
以上です。これで、カスタムJavaScript検証ルールを使用して、シングルラインテキストフィールドにリアルタイムキーワードブロックリストを追加する方法を学びました。
フォームの送信ボタンを、特定の入力項目に基づいて条件付きで表示または非表示にしたいですか？「送信ボタンの条件付き表示方法」チュートリアルをご覧ください。