Basic Slider

The Basic Slider element allows you to add a Basic Slider with start and end values.

Element Tab

The Basic Slider element has the following attributes in the Element tab:

• Name - Title of the element

• Description - Description of the element

• Minimum Range Value - minimum value that the Basic Slider Button can take

• Maximum Range Value - maximum value that the Basic Slider Button can take

• Range Step - shows the step to grow the range. The field will be disabled if the Jump between scale points setting is enabled or the Input slider style is selected.

• Default Range Value - the initial range value is automatically set for this field before user input or changes.

• Slider Scale Points - specify the exact data points to emphasize on the slider. Enter multiple values separated by commas, using dots for decimal numbers. Example: 7.5, 10, 13.5

• Name of Value - here you can put unit measures, such as kg(kilograms), gr(grams), m (meters), etc. There is also an option to choose the alignment of the units against the value.

• Jump Between Scale Points - when enabled, the slider will lock to the specified scale points, ensuring users can only select predefined values in Slider Scale Points and not anything in between.

• Multiply by Unit Price – enables the use of a unit price multiplier. When toggled on, the final value will be calculated by multiplying the selected value by the specified unit price.

• Unit Price – the cost per unit of the selected value. This numeric field supports decimal values and defines how much each unit contributes to the total.

• Unit – a label indicating the measurement unit used for the selected value (such as centimeters, meters, or inches).

• Replace Subtotal with Multiplied Value – when enabled, this option replaces the original subtotal with the calculated value from the multiplication. Useful for pricing scenarios based on custom measurements.

Styles

Under this tab, you can select the suitable slider range style according to your needs:

Here are the available styles:

Default

Small

Multi Point

Flat Minimal

Modern

Input

Settings Tab

The Basic Slider element contains the following attributes in the Settings tab:

• Currency Sign - Enable if you want to show the currency symbol in the total summary

• Round Value - Enable if you want to round the value to the whole number in the total summary

• Hidden by Default - The element will be hidden by default.

• Calculate hidden by default - If any case hides the element via the Hidden by Default setting or hidden by some condition, the element's default value (if it is set) will be counted in the formula

• Show in Grand Total - Disable if you want to hide the element in Grand Total.

• Required - Defines whether the element will be required to fill in or not.

• Additional Classes - Add extra classes to the HTML elements to make further style changes

Add a measuring Unit

This setting allows you to add a measuring unit (Ω, cm, kg, inch, etc.) to the field.

• Unit Symbol - enter the unit symbol

• Position - select the position where the symbol should be displayed relative to the number

• Thousands separator - select the symbol to separate thousands

• Number of decimals - indicate the number of decimals in the fractional part

• Decimal separator - select the symbol to separate the fractional part

Example for Using Basic Slider Element

We will show an example of using a range element to calculate the ideal weight. The calculators will have fields to input age, height, gender, and formulas. We will use a range element for users to choose their height.

That is how the calculator will look on the user page:

You can set up Multiply (cost per value) when you want the value a user inputs to multiply for the cost. For example, if you offer scooters for rent for 1.5 USD/ an hour. The values will multiply by 1.5 to calculate the fees for the rent.

That’s how it will look on the user’s page.