Adding a range slider field to your form had never been so easy before. Just go to the Advanced Fields on the Forms Field lists and drag and drop the Range Slider field to your form.
On clicking on this field, you will see General Option to set the Minimum Value and Maximum value of the Slider. You will also be able to set the Step that the Sliding Handle will take when sliding in in action.
Click on the Advanced Options and then you will see the Advanced Settings for the Range Slider.
In the Advanced Options, you are provided a lot of options to customize with. I will briefly let you know the purpose of each of them.
Skin: This option can be used to select the Sliding Handle Type. You have these options to choose from. Flat, Big, Modern. Round, Sharp Square.
Slider Handle Color: This option lets you select the color for the slider handle.
Slider Highlight Color: This option lets you select the color for the dragged slider track. This color will be shown in the track from the starting point to the current position of the slider handle.
Slider Track Color: This option lets you select the color of the entire track from Starting to Ending on which the handle will slide.
For example, the Slider will look like this if I selected Red Handle color, Green Highlight color, and Blue Track color for the slider.
Now, Let’s discuss other options:
Show Grid For The Slider: If you enable this option, you will be shown a grid of your Minimum and Maximum Value in the front end.
Show Slider Prefix Postfix: After you enable this option. you will be able to show the Prefix and Postfix on top of Starting and Ending points of the Slider. In the screenshot below, I have used Go and Stop as Prefix and Postfix for the Slider.
Show Slider Input: Enabling or Disabling this option will let you show/hide the input box at the end of the slider.
