Streaming live at 10am (PST)

API Key works on Maps component but not on embed custom code


#1

Hello! Maybe this is a stupid problem but I’m not finding the answer anywhere :slightly_frowning_face:

I have this page: http://asu480.webflow.io/eventos/id-voluptatem-ex-dolores
And I wanted to add a dynamic map following this tutorial (great tut btw): Dynamic Google Maps

But Google keeps showing me: “The Google Maps API server rejected your request. This service requires an API key.”

I tried adding just that “Google Maps Embed API”. I also tried adding the “Maps Javascript API” in the Integrations section and the same in the embed code. And they are all enable:


Does someone know what I have to do? Thank youuuuu!!! :blush:


#2

The API key field is for the maps component only. To set API key for your custom map, you need to follow the instructions here or here depending on which one you are using

https://developers.google.com/maps/documentation/javascript/get-api-key

https://developers.google.com/maps/documentation/embed/get-api-key


#3

Yes! That tutorial said that I had to use a Maps Embed API (which I did). But it’s still not working. Maybe you can check out if something is wrong in the code?

This is my share link: https://preview.webflow.com/preview/asu480?preview=659170f2248ea5c3947b8c6eebc0f285

Is in the collection page that I used that embed code for google maps.


#4

Custom code only works when published.


#5

Thanks for this !!! i was getting rly frustrated trying to get the embed map with the api key for the map component… much love!