Is it possible to have a price selector like this with the CMS filter attribute solution?

[gabriel.babus]

Hi there, is it possible to create this sort of price selector with presets like this?

[Support-Luis]

Hey @gabriel.babus! Yes it is!

If you have the component already built please share a link and I’ll show you any extra setup if needed

[gabriel.babus]

Hey @Support-Luis great to know!

Here’s my current structure

https://preview.webflow.com/preview/realtor-dev?utm_medium=preview_link&utm_source=designer&utm_content=realtor-dev&preview=f17aad4b879e9a5907719369e36322d0&pageId=66aca1887b06c65e0a4af72a&locale=en&workflow=preview

I have a similar layout, check out under the “price” tab where i also use the custom select component

[Support-Luis]

Hey @gabriel.babus! It is a simple setup you are just missing two attributes and the correct format for the value on your select elements.

You just have to set the fs-cmsfilter-field = "price" attribute to both select elements and use the range option fs-cmfilter-range = from || to accordingly

These should be the select options value format (Notice that I added a 0 option to show all elements but you can adjust as needed)

<option value=>$0</option>
<option value="50000">$50k</option>
<option value="100000">$100k</option>
<option value="200000">$200k</option>
<option value="300000">$300k</option>
<option value="400000">$400k</option>
<option value="500000">$500k</option>
<option value="600000">$600k</option>
<option value="700000">$700k</option>
<option value="800000">$800k</option>
<option value="900000">$900k</option>
<option value="1000000">$1m</option>
<option value="1500000">$1,5m</option>

It should look like this

Let me know hoe it goes!