The WordPress range slider field allows users to drag a handle to select a number from a defined range of numbers. The slider fields always have a value, so it isn't empty. i.e. even 0 is considered a non-empty value.
Standard field options
The range slider field has the following standard options:
- Field Type
- Required
- Field Key
- CSS Layout Classes
- Label position
- Visibility
- Conditional logic
- Dynamic default value
Field-specific options
In addition to the standard field options, a number slider field has a few field-specific options.
Number slider range
Set the number range for your slider field. A minimum number of 0, maximum number of 100 and step number of 1 is set by default.
Format number as currency
Select this checkbox to display the number value on the slider as a currency. It will use the currency format configured in the Formidable → Global Settings by default.
Custom currency format
Select this checkbox to use a custom currency format. By default, the currency format adds two decimal places to the number value with the currency symbol. This option allows setting a custom thousand separator, decimal separator, decimal places, or a preferred symbol.
Before & After Input
Use this field option to include a unit beside the number selected in the slider.
For example, add 'Years' for the After Input setting, and you will see '20 Years' above the slider when 20 is selected. When one of these options is set, the minimum and maximum values for the entered range will show beneath the range slider.
Field styling
To customize the number range slider, go to your Visual Form Styler and scroll down to the
- Color: Set the border color of the slider handle.
- Bar color: Set the color of the slider bar.
- Font size: Set the font size of the range value.
- Track height: Set the height of the slider bar.
- Circle size: Set the size of the slider handle.
Display Number Slider field
You can display the range slider field value in a form's confirmation message, email, or View.
- Display value: Display the value submitted in a slider field.
[x]
Replace x with the ID or key of the slider field.