Customizing a Slider element
A Slider is a graphical input field that allows site visitors to input a number within a pre-determined range. Using a slider will allow users to select any number that falls between the slider’s range, or along some pre-defined scale. It provides a formula with a numeric value chosen by the individual using your calculator.
- You can change the title of your element by using the Element Label input field. The toggle controls whether the label is visible or hidden.
- The Element Tooltip is a text field that lets you give more context to each element or explain what information you require to input. Once enabled, it will appear as a small info icon next to the element title.
- You define your slider’s range in the Min and Max fields. If you select 0 as the minimum number and 20 as the maximum, users will only be able to choose between these numbers.
- The Default value input field allows you to choose what number the slider will be set at by default.
- The Decimal Places slider controls how many decimal places will be available after the decimal point.
- The Slider Scale input field allows you to select which numbers will be displayed on the slider. The numbers you enter in this input field should be between the minimum and maximum numbers of the slider’s range.
- In addition to using numbers on your slider, you may also use words and phrases associated with numbers. For example, if your slider’s range is from 1,000 to 5,000, using full numbers to mark intervals might make the slider look too cramped. So instead of have the slider read 1,000, it can display 1K, 2K, 5K etc. To do this, add the following line to the Slider Scale input field:
- 1000:1K, 2000:2K, 5000:5K
- In this case you will see 1K, 2K and 5K points on your slider, and they will be associated accordingly with 1,000, 2,000, and 5,000 values, which will be transferred to the formula once selected.
- The Always Show Current Value toggle allows you to always show users the selected value above the slider. By default it is not shown when the slider is not in use.
- Turning on the Jump Between Scale Points toggle will make it so that the user will be able to use the main slider with the numbers you have written in the Slider Scale input field. If you select the numbers on the Slider scale to be 5, 10, 20 and 50, the user will only be able to choose one of these specific numbers.
- The Slider Size option allows you to choose one of three slider styles: Small, Regular and Large.
- The Step input field allows you to set up the size of the intervals users can choose from on the main slider. If you choose the Step size to be 5, the slider will allow users to select number at intervals of 5. For example, if your slider scale is from 0 to 20 and your slider’s step is 5, users will only be able to choose every fifth number – 0, 5, 10, 15, and 20. They won’t be able to choose 12 or any other number in between.
- The Prefix input field allows you to write something before the slider's value.
- The Postfix input field allows you write something after the slider's value.