Since June 2018, Google requires every website using Google Maps to have its own API key. Don't worry though, setting one up takes about 5 minutes and it's free for most websites.
Will I have to pay Google?
Probably not! Google gives each API a free tier of 10,000 requests per month. To give you an idea:
Map loads: 10,000 free per month (every time someone views your store locator, that's one load)
Geocoding: 10,000 free per month (converting addresses to map coordinates)
Places: 10,000 free per month (the search autocomplete when visitors type an address)
Geolocation: 10,000 free per month (detecting a visitor's location)
Each free tier is counted separately, so using all your map loads doesn't eat into your geocoding allowance. Most StoreRocket users never pay a cent to Google.
If you do go over, rates are low ($5-7 per 1,000 extra requests). You can always set up budget alerts in Google Cloud to keep an eye on things.
Note: Google does require you to add a billing method during setup, but you won't be charged anything unless you exceed the free limits.
Step 1: Open Google Cloud Console
Head over to Google Cloud Console and sign in with your Google account. If you don't have one, you can create one for free.
When prompted, select both Maps and Places.
Step 2: Create a new project
Click the project dropdown at the top, then New Project. Name it something you'll recognize later (your company name works great). Hit Create.
Step 3: Set up billing
Google won't let you use the API without a billing account on file, even though you almost certainly won't be charged.
Go to Billing in the sidebar
Click Link a billing account
Follow the prompts to add your payment info
That's it. Again, you won't see any charges unless your store locator gets more than 10,000 visits a month on the map page.
Step 4: Enable the APIs
Your store locator needs four APIs to work. Go to APIs & Services > Library and search for each one. Click into it and hit Enable.
Maps JavaScript API — renders the actual map
Geocoding API — turns addresses into coordinates
Geolocation API — lets visitors search "near me"
Places API — powers the address search suggestions
Make sure all four are enabled. Missing one is the most common reason maps don't load.
Step 5: Create your API key
Click Create Credentials > API Key
Copy the key (you'll paste it into StoreRocket in the next step)
Important: restrict your key! Click Restrict Key right away. An unrestricted key is a security risk.
Under Application Restrictions, choose HTTP referrers (websites) and add:
*yourdomain.com/*(replace with your actual domain)*storerocket.io/*
Using Shopify? Also add: admin.shopify.com/*
Under API Restrictions, select Restrict key and check only the four APIs from Step 4.
Hit Save.
Step 6: Paste the key into StoreRocket
Almost done! Head to your Map Provider settings, paste your API key into the Google Maps field, and save.
Your store locator should now show Google Maps. Give it a minute to kick in.
Something not working?
"For development purposes only" watermark
This means billing isn't set up yet. Go back to Billing and make sure an account is linked to your project.
Gray box or the map won't load
Usually a missing API. Double check that all four APIs from Step 4 are enabled in your API Library.
"RefererNotAllowedMapError"
Your domain isn't in the allowed list. Go to Credentials, click your key, and add your domain. Don't forget both the www and non-www versions.
Still stuck? Hit us up on live chat and we'll sort it out.