In-Depth Look into Form Fields and their Settings
How To Create A New Form Field When Customizing A Form
To add a new form field on a form, click on the "Add Field" button:
Clicking on this button will generate a new form field:
Clicking on the Gear Icon will display further settings:
To turn on and require validation rules for a form field, please read this article:
Toolbox » Form Manager » Field Validation Options
To clone a form field, please go to Actions >> Clone Field:
In-Depth Look into Each Setting
** In general, customizing forms is not something we recommend if you are not a developer, however, these instructions should help if it is a very simple change like changing the text of the field or adding a custom field.
Field Label:
Inside the "Field Label" add the label/name of the field:
Database Variable:
This section is the area where the variable name is added. The variable is how this particular data will be stored in the database of the site.
Important information to keep in mind:
- If a field is created without this information, when members submit the information, it will never be stored or saved.
- It's important to note that all existing form fields have a database variable and those should not be changed unless doing so for a very specific purpose knowing all consequences that can happen by doing so.
The variable goes here:
This variable name will also display in the front-end in the code view:
It's important to know that all database variables should only contain lowercase characters and there should be no spaces in the variable name, if using more than one word for the variable please use underscores to separate them.
All database variables must be unique:
Type of Field:
Select from the available options:
In this article In-Depth Look Into Each Field Type, we go over the different types of form fields that can be created with little or no coding knowledge:
Required Field?:
This form field section is specifically designed to determine whether or not a field is required to submit the form:
When enabled, this is how it looks on the front-end, a red asterisk * will appear:
Placeholder Text:
Inside this section add text that will go inside the field as example text:
Front-end display:
Field Help Text:
Inside this section add text that will appear under the field:
Front-end display:
Default Field Value:
Inside this section add a pre-filled field on the form:
Front-end display:
The difference between the Placeholder Text and Default Field Value is that if a website visitor submits the form without making any changes to the field, the value-added on Placeholder Text will not be saved while the value-added on the Default Field Value will be saved in the database.
Additional Field CSS Class:
Inside this section add custom CSS classes to enhance the design of the fields. This is particularly useful for developers/web designers. If not familiar with CSS we do not recommend using this field:
Front-end display:
If need to gray out a field, add "readonly" after the CSS class:
Front-end display:
Outer Element ID:
Inside this section add a custom ID element to the field. This is particularly useful for developers/web designers, as this allows the adding of additional CSS to this specified form field:
Front-end display:
Input View:
Inside this section decide whether or not the new field will show up on the form being customized.
If disabled, the field added will not be displayed on the form. This is particularly useful in cases when there are new fields on the form that will be needed in the future, site owner doesn't want the members to fill them out yet.
Below the display settings, there are some fields called "Alt. Field Label".
They allow adding a new field label name for each display setting.
For example, the main field label is "Courses".
The Input View (Form) is going to be renamed "Completed courses".
The Display View (Front-end) is going to be renamed "Latest Courses".
The other fields labels (Lead Previews, Include in Emails, Table View) are empty, so they will use the main field label.
Below the Input View, it's a checkbox for Admin Only, this works when inputting data, only the admin of the website will be able to view and edit this field, not the members.
NOTE: If the field is set to "Require Field" and "Admin Only" at the same time a warning message will show up avoiding the form to be saved.
Display View:
Inside this section decide whether or not the data entered in the new field will show up on the front end of the site.
Important to note that this particular setting does not apply to all forms. For example, enabling or disabling this setting for Contact Us form will not make any difference as there is no front-end view for this form on the site (after submitting). This would apply however if a custom field is added to a feature form like Classifieds or member form like Contact Details.
A good example of the functionality of this setting can be found in the article down below:
How To Display Custom Post Fields In The Post Details Page
Inside this section is the option to add a button to the form. The Type of Field needs to be set to "Website URL", the Display View set to "On" and the options for buttons will show up like this:
Inside this section it's also the option to open the link button into a new tab:
Lead Previews
Inside this section decide whether or not the data entered in the new field will show up on Lead Previews.
This setting applies to only lead forms like Website - Lead Form - Get Matched. If this setting is enabled and member is set to receive a preview email when a lead is submitted, the field specified will display as it can be seen down below:
This can be helpful in instances where the site owner might not want to share all the details of a lead submitted to encourage the member to visit the website or even purchase the lead.
Include In Emails:
Like the previous setting, if enabled, it shows data when the form is rendered in an email and for accepted leads.
A good example to enable this setting would be for the Contact Us form as when it is submitted, it does send out an automated email to the admin of the site.
Table View:
This setting will make the Field Label and the Content visible on the Admin Dashboard.
This field only works with the following forms:
- Website - Lead Form - Get Matched
- Listing - Write Review
