So I have this client project for a real estate agency. They want to implement a search bar on the homepage and I have a bit of a struggle here with this.
The search bar should work like this: there are dropdown menus where you can choose the area, type of property, etc.
I want to find a way to store this data the user enters while doing his search:
Bali (area) - Seminyak (area) - Villa (type) - For lease (ownership) - 500,000 (price)
Ok, now when clicking on search, the user is taken to a search page (not the webflow one) with ALL the listings available.
Having stored somewhere the keywords of the user, we can now automatically filter (using finsweet attributes) directly on the page the listings to have a relevant outcome for the user.
If the user wants, he can then change the filters on the left panel with filters.
I have a basic idea of how it can happen with some JS but I don’t know where to start because I know nothing about code…
A friend of mine told me to use a database like airtable instead of doing it in the front end… Any suggestions on how to implement that? What’s the best solution?
hi @Simon_De_Ridder as you are looking for multi reference filter you should take look on finsweet CMS filter.
Yes you can use it if necessary and your client will be happy with extra expenses as Airtable and Make aren’t cheap but in real estate it should not be an issue. there is many sources to find about how to
Thanks, I am already using the Finsweet CMS filters. Like I said on my post, my problem is how to store the keywords from the homepage to this search page and then filter automatically.
Even if it’s real estate, my client doesn’t have a big budget so i’m looking for free ways to do it…
Considering that the search bar will actually be a FORM
One of the options is to redirect the user to another page when the form is submitted “form-redirect” so that’s what I would need to redirect to the “results page” which is essentially a collection of all listings, filtered with FS CMS filters.
So I need to collect the data from the form, and use it to filter the listings on the “results page” using JS.
Still looking into how to write this JS script… but if you guys have any ideas
@Simon_De_Ridder Webflow actually has this feature built-in, their forms have an “action” area in the form settings where you can put in the link for your results page, and it will automatically redirect you to the page with the form data appended to the url. Normally you would have to manually write a script to serialize that form data.
I’m pretty sure Finsweet’s CMS filters use query parameters to filter out their data on the page, so as long as you build out that filtering system on the results page, and can match the names of the select fields on the form with the names of the filters on the results page, you should be good.
