Google Maps - API Key Setup Instructions
Google maps has changed its policy as of June to require all maps to have their own API Key. Google maps also adjusted its pricing and provides up to 28,000 map loads each month for free. More details regarding pricing at: https://cloud.google.com/maps-platform/pricing/sheet/
If you would prefer to not setup billing with Google or are concerned about getting close or above the free limits, we have the option of using Mapbox instead. Mapbox has beautiful maps, higher free limits (50,000 map loads + 50,000 searches free each month). You can easily setup a free token with mapbox to use instead (no billing info required). Take a look at our mapbox option here: https://storepoint.co/dashboard/map_provider
To continue with setting up a Google Maps API Key, simply follow this tutorial below.
Any questions or concerns? Get in touch with us at [email protected] and we'd be happy to help.
Step 1 - Get Started
Follow this link: https://cloud.google.com/maps-platform/#get-started and click "Get Started".
Make sure to select both "Maps" and "Places", then click Continue.
Step 2 - Create A Project
Create a new project and give it any name you'd like. Click Next when ready.
Step 3 - Create Billing Account & Enable Billing
Setup up the google maps API key requires billing be provided. As long as you are within the free limits (under ~28,000 map loads each month, you should be fine). More details on pricing: https://cloud.google.com/maps-platform/pricing/sheet/
If you are concerned about this, please setup using the alternative Mapbox solution we have. This solution gives you 50,000 map loads + 50,000 searches per month free. With Mapbox, even if you go over the limits it is quite affordable at only $0.50 per thousand extra map loads or searches.
Get in touch with us at [email protected] with any other questions.
Step 4 - Enable API & Get the Key
Once you enable all APIs, you will get an API key. Simply copy-paste that key into the Storepoint dashboard Google Maps API Key setting: https://storepoint.co/dashboard/map_provider
Although you have a Key now, we strongly suggest securing the key. Please take a look at the next step.
Step 5 - Prevent Others from using/stealing your Key
This part should only be setup once your website is live on your real domain, otherwise, the locator won't work on testing domains. Once your website is live, you can come back to this step for completion.
To prevent others from using your key, we strongly suggest restricting your key. Once you have pasted the API Key into the Storepoint setting, follow the link under "To improve your app's security, restrict this key's usage in the API Console." or go to: https://console.developers.google.com/apis/credentials and click on your newly created API Key.
Scroll down to the bottom of the page and under "Application restrictions":
- Select "HTTP Referrers"
- Fill in the field that appears below with:
and the 2nd new field that appears with:
For example, if the URL where the locator appears on your website is: https://www.somewebsite.com/find-us you would set the field to somewebsite.com/* and the 2nd field that appears after to *.somewebsite.com/*
If you have any questions about securing your key, please contact us
Do you see any errors?
- If you see errors when trying to search using the searchbar, you may have not enabled Places API - use the following tutorial to fix this: https://storepoint.zendesk.com/hc/en-us/articles/360014458711-Search-function-not-working-or-shows-an-error
- If the map is showing errors, check to make sure that the HTTP referrers setup in Step 5 match the domain where you have your map embedded / where you are previewing. The map will not work on any domain except the domains setup in HTTP referrers for security.