Streaming live at 10am (PST)

Google Maps API Question?


#1

What am I doing wrong here... for some reason the Google Maps API key doesn't seem to work for my map on the contact page. Any advice would be great! Probably something simple... thanks!

Live: svzdesign.com/contact

Preview:
https://preview.webflow.com/preview/svz-design-official-website?preview=065a28cbd38ff356d5e369fcc138c4e0


#2

When I'm looking at your working file, I do not see a map widget div label. Not sure how I'm able to see the map preview image in your file.

There should be a map widget included on page as I'm showing in the screen grab. (I added one above your image here.) Then the api key is added in your settings area. (unable to see this in preview mode so not sure how you have it set up)


#3

That's because it's not using the Webflow Google Maps Component, but a third-party script.

You should contact calendly and ask where to insert the Key.


#4

I'm confused? I used the Map Widget in the background of a Calendly Embed. Why would I contact calendly and ask where to insert the Key?


#5

I'm confused? I dragged a map widget inside a section?


#6

@samliew @Port_of_Folio checked the Java Script Console and this is what I see for an error.

Why is the happening when I've tried updating my API Key like 10 times and refreshing??

Any Ideas?


#7

@samliew @Port_of_Folio I figured out the Issue!

I was using the Embedded Maps API not the Javascript API.

For everyone adding a Google Maps API to their site in the future.

Use this link:

https://developers.google.com/maps/documentation/javascript/adding-a-google-map

Click "Get Key" at the Top Right of the Nav.