How to Add a Filterable Field to a Form for Internal Use

はじめに

フォームに、内部専用のフィルタリング可能なフィールドを追加しますか？エントリをすばやく簡単にフィルタリングできると時間を節約できますが、そのフィールドをフォームに表示したくない場合もあります。このチュートリアルでは、それを実現するのがいかに簡単であるかを正確に示します。

例では、リードジェネレーションフォームを作成します。電話番号が確認されたら、エントリにフラグを追加できるようにしたいので、後でレポートからフィルタリングできます。

最初のステップは、フォームを作成し、ユーザーが入力するための関連フィールドをフォームに追加することです。

ただし、電話番号が確認された場合に後でフラグを立てることができるフィールドも追加したいと考えています。これを行うには、単一行テキストフォームフィールドを追加します。

後で結果をフィルタリングするために使用できるテキストフィールドをフォームに追加する

フォームの作成にヘルプが必要な場合は、このドキュメントを確認してください。

このフィールドは内部専用フィールドであり、訪問者向けのフォームに表示したくないため、後でCSSを使用してこのフィールドを非表示にするために使用できるCSSクラスをこのフィールドに追加します。

フィールドにCSSクラスを追加するには、フォームビルダーからフィールドの詳細タブを開き、CSSクラスにwpforms-field-hiddenを追加します。

フォームフィールドにCSSクラスを追加して、フォームからこのフィールドを非表示にする

このCSSクラス名はWPFormsのデフォルトクラスであり、CSSはすでに配置されています。クラスを追加すると、フィールドにdisplay:none;を適用するCSSが自動的に適用されます。

ユーザーがサイトにアクセスしても、内部専用のフィルタリング可能なフィールドは表示されません。

フォームに入力する際に、フィールドは訪問者に表示されません

このステップでは、エントリ画面の列表示を変更します。これを行う方法の詳細については、こちらのドキュメントをご覧ください。

エントリ画面を表示するときに、内部フィールドを表示したいと考えています。

エントリリストを表示するときに内部フィールドを表示できるように、列表示を変更する

これで、エントリ画面を表示すると、このフォームのすべてのエントリが表示され、上記で追加された内部フィールドも含まれます。

フォームの入力ページが読み込まれると、内部フィールドが表示されるようになりました。

これで、フォームのエントリ画面で、これらのエントリを簡単にフィルタリングできます。

これで、フィルタリング可能な内部フィールドをフォームに正常に提供できるようになりました。

エントリの検索とフィルタリングの詳細については、こちらのドキュメントをご覧ください。

送信ボタンの色を変更するためにCSSを使用したいですか？送信ボタンの色を変更する方法のチュートリアルをご覧ください。