The hidden input field in Fluent Forms allows you to store and retrieve data without displaying it on the form. This field helps track user data, pass dynamic values, or store information for backend processing.
This article will guide you through adding the Hidden field in your Fluent Forms for your WordPress Site.
Adding the Hidden Field #
To learn how to add the hidden field to the Fluent Forms, follow the steps with the screenshots below –
First, go to the Forms section from the Fluent Forms Navbar, choose a desired Form, and click the Edit Icon to open the Editor page of that form.
If you do not have any existing forms, read Create a Form from Scratch or Create a Form using Templates documentation to create a new one.
Once on the Editor page, click the Plus Icon in your form editor and open the Advanced Fields module. The Advanced Fields option is also in the right sidebar under the Input Fields tab.
Now, select the desired Hidden Input field by clicking on it or Dragging and Dropping it into your editor.
Customizing the Hidden Field #
A Hidden field has been added. You can edit this field by hovering over it and clicking the Pencil Icon. It will take you to the Input Customization tab on the right side and offer the following options for customizing the field.
You will now find various settings options for customizing the field. Located in the Input Customization Tab, these options allow you to configure essential aspects of the hidden field.
All the Settings under the Hidden Field mentioned above are briefly explained below –
A. Admin Field Label: The admin field label is a field title displayed only to admin users. This means that you can configure this option to show a different field label for your admin users when they view the form submissions.
B. Default Value: Using our shortcodes, you can manually set any fixed value in your field and pre-filled your input field dynamically. To better understand Dynamic Default Value, read this article. You can add different default values by clicking the Three-dot options from the right side.
C. Name Attribute: The input field’s name attribute is the HTML equivalent of the same name. You don’t need to modify this.
Embed the Form into Frontend #
Once you complete the customization, click the Save Form button to save all your changes. Click the Preview & Design button in the middle to see the form preview.
To integrate and display the form on a specific Page or post, copy the Shortcode from the top right side and paste it into your desired Page or post.
Preview of Added Hidden Field #
Here is the Preview of the Form to test the hidden field functionality.
After that, click the Entries section of this form. You will see the entry result for your Hidden fields.
Congratulations! You will successfully add the Hidden field in your Form.
If you have any further questions, concerns, or suggestions, please do not hesitate to contact our support team. Thank you.
