# Creating a Google Maps API key

{% hint style="success" %}
**Why do you need to create a Google Maps API key?**

* You want to show a map for PICKUP LOCATION
* You want to validate **local delivery by address with maximum distance** from your store&#x20;
  {% endhint %}

{% hint style="warning" %}
You must have an active GG Maps API key to activate feature for Pickup Map and Local delivery distance restriction.
{% endhint %}

## 1. New Google Cloud users

To create a Google Maps API key, follow:

#### Step 1.  Visit [Google Maps Platform](https://mapsplatform.google.com/) page and click Get started&#x20;

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2F90xAFTmgUqR557SmWFvI%2Fimage.png?alt=media&#x26;token=8853377c-69c2-45d2-b508-2574b0c2e787" alt=""><figcaption></figcaption></figure>

#### Step 2. Verify your Account Information and fill in Payment details to add your business

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2Fw9po6znxVfnDiUets9Hd%2Fimage.png?alt=media&#x26;token=e18a40a4-bcdc-49a5-9ee8-4f1e7ac832cb" alt=""><figcaption></figcaption></figure>

#### Step 3. Copy the API Key and check Enable all

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FGCg4OU1FNz61qNUHB2tR%2Fimage.png?alt=media&#x26;token=0225ac7f-033f-478c-888a-0f78e31b2664" alt=""><figcaption></figcaption></figure>

#### Step 4. Go to Google Maps Platform and choose "Maybe later" to not add a restriction

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FgjM3Ak7a0U1UXzeZPUy4%2Fimage.png?alt=media&#x26;token=371b7fa1-e54a-4b55-a2a4-0d0b8aa0ff05" alt=""><figcaption></figcaption></figure>

## 2. Exisiting Google Cloud User

#### Step 1.  Visit [Google Maps Platform](https://mapsplatform.google.com/) page and click Get started&#x20;

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FXLBN8LYpuBUwm6xcTfnR%2Fimage.png?alt=media&#x26;token=c8050d6d-bf7d-479e-bdab-cd607d1e8a1c" alt=""><figcaption></figcaption></figure>

#### Step 2.  Click My First Project and choose New Project

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2F4t1KwMZJPzRbzNm5EqIh%2Fimage.png?alt=media&#x26;token=5a539f41-a7af-47d0-8d00-7ae699b7dee9" alt=""><figcaption></figcaption></figure>

#### Step 3. Add a Project Name and Billing account and click Create.

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FSmzuYEaajkC5TmXtXqo3%2Fimage.png?alt=media&#x26;token=5e73a0b9-1600-431b-b036-6b8a7098d272" alt=""><figcaption></figcaption></figure>

#### Step 4. Click Select project and then click Keys & Credentials

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FoHcAapOXNEZKExIjQWEf%2Fimage.png?alt=media&#x26;token=27284450-efeb-4be6-95cf-40e57b70e326" alt=""><figcaption></figcaption></figure>

#### Step 5.  Copy the API Key and check Enable all

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FwPp93Ed4G82t9YeVQJD2%2Fimage.png?alt=media&#x26;token=c3e91131-4cfc-420a-8523-861f1616cdda" alt=""><figcaption></figcaption></figure>

#### Step 6. Go to Google Maps Platform and choose "Maybe later" to not add a restriction

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FA1hMFSFeVtVmUFJU6gyC%2Fimage.png?alt=media&#x26;token=27052e18-4413-44b5-ae12-4da0de416ac3" alt=""><figcaption></figcaption></figure>

## 3. Use case

After having a valid API key, you can use this key to activate feature for Store pickup location and Delivery distance restriction.

{% hint style="success" %}
Ensure that you have enabled these API: [Routes API ](https://console.cloud.google.com/apis/library/routes.googleapis.com?inv=1\&invt=Abs26Q\&project=daring-solstice-454704-f1)and [Maps JavaScript API](https://console.cloud.google.com/apis/library/maps-backend.googleapis.com?inv=1\&invt=Abs26Q\&project=daring-solstice-454704-f1) and [Places API](https://console.cloud.google.com/apis/library/places.googleapis.com?inv=1\&invt=AbtCuA\&project=maps-projects-454903\&pli=1)
{% endhint %}

### 3.1. Store Pickup Map

#### Step 1.  Navigate to General Settings and click Advanced Settings, then choose Enable Google Map

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2F2kbFLLhWMB91NVgZicpH%2Fimage.png?alt=media&#x26;token=f6083cac-7d48-4372-bcf3-2f77dd344d4e" alt=""><figcaption></figcaption></figure>

#### Step 2. Paste your API key&#x20;

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FqSvmQ71elBzieLkVA281%2Fimage.png?alt=media&#x26;token=c4e2fcc3-17d7-40a5-8955-f3358807baf3" alt=""><figcaption></figcaption></figure>

#### Step 3. If you have added an API key successfully, it will appear here

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FAUmwJb5oJoASvzXA9s6I%2Fimage.png?alt=media&#x26;token=4818da6a-4df2-4936-ae1d-4a9dd51390df" alt=""><figcaption></figcaption></figure>

As a result, your storefront will look like this:

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2F9h7yybzQGH0POQyJpKNi%2Fimage.png?alt=media&#x26;token=a1345211-3158-4269-ab19-a80d6ea00ff4" alt=""><figcaption></figcaption></figure>

### 3.2. Local delivery distance restriction

#### Step 1.  Navigate to General Settings and click Advanced Settings, then choose Local Delivery Validation

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2F6YnCeOJHTVnTPOUfxa0g%2Fimage.png?alt=media&#x26;token=ee5d6e5c-5ced-41ad-ae6e-d4009dbb6f41" alt=""><figcaption></figcaption></figure>

#### Step 2.  Paste your API Key

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FzZFqF80FEifm3E2W8KS0%2Fimage.png?alt=media&#x26;token=690f3380-fc8a-42d2-a097-4c3be35e5698" alt=""><figcaption></figcaption></figure>

#### Step 3. After successfully adding API key, choose the unit you want to measure distance in

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2F43OMEuEUh9XPMs3FmrZP%2Fimage.png?alt=media&#x26;token=86da2f11-db92-44cd-bdde-3a180aa97527" alt=""><figcaption></figcaption></figure>

#### Step 4. Go to Location and edit Delivery settings to choose maximum distance you want to set

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FX2EOfiua5hIimt0kRn10%2Fimage.png?alt=media&#x26;token=55434c3f-fe8f-4abc-81a4-2cd08bd15316" alt=""><figcaption></figcaption></figure>

In the storefront, your customers will need to enter their address in the widget to check if delivery is available

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FD5lhqV6oqxQEYfYtU4v1%2Fimage.png?alt=media&#x26;token=ce9b7adc-1dec-4d39-805b-ff6860c5b03f" alt=""><figcaption></figcaption></figure>

If the address that the customer entered in the widget falls within the radius you specified in your delivery condition settings, he will be able to proceed

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FkP6Wi9p91jUQrpUR4UGL%2Fimage.png?alt=media&#x26;token=68335d8b-8f75-4650-b77e-0b6f67d3f900" alt=""><figcaption></figcaption></figure>

If the address that the customer entered in the widget is out of the radius you specified in your delivery condition settings, he will be unable to proceed further

<figure><img src="https://825397875-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fdt3xbyFDcRxJKS1ZARtZ%2Fuploads%2FXek1vNZKegkUbjyHEWmn%2Fimage.png?alt=media&#x26;token=4c5793da-53d8-410e-b5d6-f02bb4edbb61" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.dingdoong.io/how-to-enable-gg-maps-api-key/creating-a-google-maps-api-key.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
