2 minutes
It's time for another short Webflow tutorial! Haven't heard of Webflow before? You can check it out and sign up for an account here (yes, that's an affiliate link). This time I'm showing you how to filter a collection list (in my case a real estate listings page) by price and how to solve a small but annoying issue with commas in Webflow. This allows you to display the properties either from the most expensive one to the most affordable one or the other way around. While you might know that this can be achieved by using the filter feature in Webflow, you might not know that keeping a comma in your price can be quite tricky. Especially for real estate listings it's important to have keep a comma in your price for better readability and to allow visitors to scan the prices on the "for sale" page more quickly.
However, that's where the problem starts. Webflow currently doesn't allow you to include a comma in your "numbers" field in the CMS collection item. But you need the "numbers" field to be able to sort your properties by price – having the price as a "plain text" field (which allow commas) removes the ability to filter by price. Very annoying! So how do you get around this?
This is how I solved the issue:
Want to know how to set up filtering options so your site visitors can actually filter by price or by newest/oldest properties? I'll do a brief tutorial about this soon. Stay tuned!
Fill out the form below and I'll be in touch with you usually within 48 hours. You can also say hi via email.