---
title: "Map settings"
description: "Choose Google Maps or Mapbox, add your API key, and set the area customers see when they first open your store locator."
product: "Shoppy Store Locator"
section: "Settings and design"
url: https://help.shoppyconnect.com/store-locator/settings-and-design/map-settings
markdown_url: https://help.shoppyconnect.com/store-locator/settings-and-design/map-settings.md
last_updated: 2026-11-05
tags: ["settings", "map", "google maps", "mapbox", "api key", "default viewport", "zoom"]
---

# Map settings

> Choose Google Maps or Mapbox, add your API key, and set the area customers see when they first open your store locator.

The **Map** tab in **Settings** controls which map your store locator uses and where it starts.

![The Map tab in Settings, with the Google and Mapbox choice, the Google Maps API key field, Find API key and How to get a key links, and the Default viewport with zoom, latitude, longitude, and a map with a marker](https://help.shoppyconnect.com/_astro/01-map-settings.eda_kjSC_ZsaRfb.webp)

## Do you need a map key?

No. Without a key, your store locator uses a free map, and customers can still:

- See your stores on the map.
- Search by store name, suburb, or postcode.
- Use **Use my current location** (or your own button text) to find stores near them.

Add a Google Maps or Mapbox key if you want:

- **Address suggestions** as customers type, so they can search from any street address.
- Google Maps or Mapbox map styles instead of the free map.

Until a key is saved, a banner at the top of **Settings** reminds you that address search is off.

## Add a Google Maps key

1. Go to **Settings** › **Map**.
2. Choose **Google**.
3. Click **How to get a key** for a step-by-step guide with short videos. In short:
   1. Create a project in Google Cloud and turn on billing. Google Maps Platform includes free monthly usage.
   2. Turn on three APIs: **Maps JavaScript API** (shows the map), **Places API** (address suggestions), and **Geocoding API** (places stores on the map).
   3. On the **Credentials** page, click **Create credentials** › **API key**, and copy the key.
4. Paste the key into **Google Maps API key**.
5. Click **Save**.

We recommend you restrict the key to your store's domain in Google Cloud, so no one else can use it. The **How to get a key** guide links to Google's instructions.

## Add a Mapbox token

1. Go to **Settings** › **Map**.
2. Choose **Mapbox**.
3. Click **Find API key** to open your Mapbox access tokens, and copy a token.
4. Paste it into **Mapbox access token**.
5. Click **Save**.

You can use Google or Mapbox, not both. Switching from one to the other clears the key you had before.

## Set the default viewport

The default viewport is what customers see when they first open the map, before they search.

1. Under **Default viewport**, drag the marker on the map to the centre you want, such as the middle of the area your stores cover. **Default latitude** and **Default longitude** update as you drag.
2. Set **Default zoom**, from `1` (the whole world) to `20` (street level). For one city, try `10` to `12`. For a whole country, try `4` to `6`.
3. Click **Save**.

## Tips

- After you add a key, open your store locator and type part of an address to check suggestions appear.
- If the map or search stops working after you add a Google key, check the three APIs are turned on and billing is set up in Google Cloud.
- Treat your Google key like a password: keep it restricted to your domain.

## Related guides

- [Search settings](https://help.shoppyconnect.com/store-locator/settings-and-design/search-settings.md)
- [Design and layouts](https://help.shoppyconnect.com/store-locator/settings-and-design/design-and-layouts.md)