[Skip to content]

Search our Site
Easysite Resource Centre
HTML5 Range

HTML5 Range

This element creates a slider which the user may manipulate to select a number and is designed for Web Apps built using HTML5. A typical example of a HTML Range field in use is:

HTML5 slider example

HTML Range element

1. Drag and drop the HTML5 Range element into the appropriate location:

HTML 5 range icon

2. Configure the element. The following view will be presented:

HTML5 range element configuration

Ž3. Edit/configure:


Enter an appropriate label for the element.  


Select whether the question and answers are displayed in two separate columns, or whether the answers sit under the question as rows in a single column. 

Physical Width

Enter the width of the answer box in percentage of the screen.


Check if required.

Default Value

If required, prepopulate the element with a default value.

Min./Max. Value

Enter an appropriate number range, for example 0 to 10 if the end user is being asked a rate an item.

Show As

Select if the element and the responses are to render in the Records view when managing Entries. If the element is to display select whether or not is displays as a link to the full response.


If required, check to allow the administrator to sort records by this field.