Use the Range slider form element to add a slider to your Component form. 

For more information about creating editable components, see Create an editable component.

Locating the range slider form element

To find the Range slider form element:

• Navigate to a component
• Click the + button on the Component form builder
• Within the Fields tab, look for the Range slider form element.

The Range slider element includes the following fields:

Title field

• Provide a name for the form element. Important: This will be displayed in your component form.

Field settings

• Min value - Input the minimum value that the Range slider can be set too
• Max value - Input the maximum value that the Range slider can be set too
• Increments - Input the increments that the Range slider can increase and decrease by
• Unit - Input the unit for the Range slide to use.
  When using the Range slider with Style guides, if no unit set pixels will be assumed and converted to REMs.

Default

• Default value (optional) - Set a default value for the Range slider.

Tooltip

• Tooltip text - Enter tooltip text here.
• Tooltip placement - Define the position of the tooltip on hover of the field.

Range slider form element

You're viewing version 8.1 of this page. View latest (8.2) documentation.

Use the Range slider form element to add a slider to your Component form. 

For more information about creating editable components, see Create an editable component.

Locating the range slider form element

To find the Range slider form element:

• Navigate to a component
• Click the + button on the Component form builder
• Within the Fields tab, look for the Range slider form element.

The Range slider element includes the following fields:

Title field

• Provide a name for the form element. Important: This will be displayed in your component form.

Field settings

• Min value - Input the minimum value that the Range slider can be set too
• - Input the maximum value that the Range slider can be set too

Default

• Default value (optional) - Set a default value for the Range slider.

Tooltip

• Tooltip text - Enter tooltip text here.
• Tooltip placement - Define the position of the tooltip on hover of the field.