← Back to Documentation Overview | Search these pages with the button in the top right

The range slider lets users filter map items within a specific range of values—like properties priced between $1,000 and $2,000, or any other numerical range you define.

<aside> 💡 Pro Tip: Rename the dropdown options

By default, all options are displayed in lowercase. You can easily change this by following this guide:

</aside>

Create in Dynamic Map App

1. Navigate to Filter and Sorting
2. Click Create Range Slider

Configure Range Slider

Set desired number field that should be searched.

Set Additional Settings

You can set the range slider to apply on release only, which can enhance your filter’s user experience.

Update Code

Insert updated code into Dynamic Map’s Custom Code

Locate in Designer

Locate the range slider and its different elements in Webflow’s designer.

The ncf-price-slider is placed inside the cru-ncf-map-filter

Styling Tricks

Add a width to your slider numbers to make sure the range slider looks smooth always.

<aside> 👉 Questions? We're excited to [email protected]

</aside>