How to add search bar to map?

[Samantha_Matthews]

Hi guys,

I have searched for a solution on this and haven’t found anything.

I am trying to give users the option to enter in a location on a form, by typing the street address or with coordinates. Ideally they will search for the location and it reflects on a map.

Does anyone know how a search bar can be added to a map, within a form?

Thanks.

[Gail_Ranger]

You typically need to have a mapping API to convert an address to map coordinates. Have you looked at the mapping integrations to see if they solve your problem?

Integrations | Maps | Webflow University

[MXI (Maxi - Webflow Designer)]

Hi @Samantha_Matthews ,
i have added some links to the google developers api documentation. Here →

Map goes full screen on published site

Hi @Samantha_Matthews , this behaviour seems to me to be weird. Is there any custom code connected to this map, class or id in the dashboard? You could delete your div and try giving the map a fixed height. [image] I think you´ll need a location input field connected to the map if this will be your final web app. Maxi

AND
here is a clonable webflow project, doing exactly what you need.

google-places-autocomplete-in-webflow-forms - Webflow

I think you just need to give the location data from the auto complete field to the map somehow.

Maxi

[Samantha_Matthews]

Hi @MXI – Thank you SO much for this. I did look for a project on Showcase and had no luck, so this is great news!!

Really appreciate your assistance. I’ll post here if I have any issues but this is a helpful resource, so thank you.