We're working on some updates.
Sorry, we're currently working on some updates to our systems. We expect this to take just a few hours, and everything should be back online shortly. We're sorry for any disruption this has caused.
Sorry, we're currently working on some updates to our systems. We expect this to take just a few hours, and everything should be back online shortly. We're sorry for any disruption this has caused.
Add a customizable range slider to your forms...
This guide gives you a quick overview on how you can add a custom range slider into your Webflow forms.
To add this into your project, follow these simple steps and add the custom code into your project or page settings.
Add your form block and input field to the page. We will be adding unique IDs to the input field in order to connect with our range slider. You can find the ID at the top of your text field settings panel.
To use the Single Range Slider, add the ID
#slider-single
To use the Full Range Slider, add the ID
#slider-range
To turn your input field into the range slider, simply add the ID to the text field as shown below.
We've included some basic settings, such as the range, where it should start, the steps plus more. You can also add a prefix like a $ or other currency codes. Take your time to review the script and experiment with changes as required!
To check everything is in order, publish your page and view the live link.
Join our newsletter list for occasional updates, products and insights.
