Streaming live at 10am (PST)

Searchable Map - Multiple Locations

Hey Webflow community,

Looking to implement a searchable map that would show business partners near the user.
I am not a developer so ideally something more plug and play would be best but still something customizable.

Let me know of what you use/have used!

When you say that you want a searchable map, are you looking to have the ability to actually type businesses etc, or do you want a Google Map showing multiple fixed locations?

I would like them to be shown by type/category of business that can be chosen by the user. The “searchable” part would be the user to input their location, city, postal/zip code, etc.

Ah, can’t help then unfortunately. If you ever need to know the code required to use custom lat/long positions on Google Maps in Webflow then I can help haha.

Interested in something like this as well. Part of my site has a place/directory section of local businesses, much like Yelp, and it would be really great to display businesses on a map based on visitor distance, a search or category.

I am able to display the business on a map on single pages but don’t know how to do multiple business yet.

@hobokencloud

Here is what I’ve managed to find so far:

MapHub: So far my favourite, still in beta and free for now.
MapBox: More customization, more developer-centric, pricing seems reasonable.
Google My Maps: Easy to use but not much customization.
PlaceGuru: Haven’t played enough yet to know.

Theres an article here that compares a few of them too.

Like I said, so far MapHub is my favourite, embedding is easy (iframe) and seems to be decently customizable.

1 Like

@Noel_Fenez thanks for sharing those - bookmarked MapHub and MapBox for future projects!

Thanks, @Noel_Fenez. This list is great. I have tried MapBox before but need to dig deeper through the documentation to experiment with it more. My challenge is having the address field from multiple items on a collection call the API to retrieve and display various locations on one map.

Similar to something like the image attached.

Hi @Noel_Fenez

I think the solution (or rather a workaround) is pretty simple - all you have to do is use the standard google maps - with an API - then you have a CMS with all your partners locations listed and you create a map with all of the locations displayed on load… . then once your user opens the map and it identifies or searches for his location it will show him on the map and around him will be the markers that you placed from your CMS (your partners) - if any exist…

1 Like

@IVG I think that can work, the only issue I see is dividing the locations by business category that users can choose.

Ex: Choosing “clothing” only shows clothing partners, choosing “markets” only shows markets around them.

MapHub and Google Maps have this built in but ideally I would be able to change the UI to something that matches the site, not something available (that I know of).

I think you can do this using mixitup library - here is a tutorial

so then you will need to have mixitup sort your data and create various array’s that will be passed into google maps to create markers

2 Likes

Hey Noel!

I noticed you initially asked here, so I thought my reply could help other people as well. :blush:

StoreRocket is a product I personally created that should satisfy those needs and it’s featured in the Webflow University as many other Webflow users are already using it. It lets you add a customizable store locator to your website with no coding required.

StoreRocket on Webflow University: https://university.webflow.com/integrations/storerocket

Tutorial on how to install it on Webflow: https://storerocket.io/blog/how-to-add-a-store-locator-to-webflow/

@hobokencloud – the store locator in the image you posted looks great and I’m using it as inspiration for the next theme I’ll release for the store locator, thanks!

More than happy to help you guys!

Adriano

1 Like

Hi @storerocket,

We’re in need of setting up a multi-location search for a Webflow website. Location details will be added via the Webflow CMS. What I’m not clear about is whether this would completely integrate with StoreRocket – i.e. as locations are added or deleted in Webfow CMS, would they also be added and removed from the embedded StoreRocket search? Will search results be able to link the details page for each location?

What we cannot really sell to the client is having to maintain two sets of listings to be updated by them (one on Webflow and one on the map search system).

Thank you for any further details.

Hi @spirelli!
I really apologize but I totally missed the notification of your message.
Just in case, I still leave a reply if you or someone else is still interested.

The search results can link to the details page, yes. This is easily done with the website property of each location or by using custom calls to action that let you add as many links as you wish.

The locations need to be added and updated directly from StoreRocket. For clients that have a number of locations, I’ve built a Google Sheets integration that let you (or your client) use a single Google Sheets document to maintain the locations. Once updated, it can be automatically sync-ed to the store locator, in real time. This has been very useful for both businesses and freelancers because you can just share the document to your client and ask him to keep it updated.

I totally understand your point in maintaining the locations directly on Webflow and having them updated on the store locator. It perfectly makes sense and you are not the first one asking about that. For this reason, a complete Webflow integration is currently under development.

Please let me know if you have any question, I just made sure to receive the forum notifications instantly. :grinning: