> For the complete documentation index, see [llms.txt](https://aries-theme.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://aries-theme.gitbook.io/docs/guides/create-a-google-maps-map-id.md).

# Create a Google Maps Map ID

#### 1. Go to Google Cloud Console

Head over to [**console.cloud.google.com**](https://console.cloud.google.com) and make sure you're in the right project.

***

#### 2. Navigate to Map Management

In the search bar, tap **Google Maps Platform,** then in the side menu go to  **Map Management**.

{% hint style="info" %}
If you don't see it, make sure the **Maps JavaScript API** is enabled first.
{% endhint %}

<figure><img src="https://2498163780-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2LxG3rPCoA6sZo7ovFkR%2Fuploads%2FY3VCdDR4hh0Gvemc7Zc7%2FCapture%20d'%C3%A9cran%202026-02-20%20104822.png?alt=media&amp;token=c5c0a6b2-0094-4cab-962a-8c4885604531" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2498163780-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2LxG3rPCoA6sZo7ovFkR%2Fuploads%2FjiOpFNDlt4oia0qFEDDZ%2FCapture%20d'%C3%A9cran%202026-02-19%20215858.png?alt=media&amp;token=475e2da0-afe7-4fcf-9039-faf6c7ff7f91" alt=""><figcaption></figcaption></figure>

***

#### 3. Create a New Map ID

* Click **"+ Create Map ID"**
* Fill in the details:
  * **Name** → Give it a descriptive name (e.g. `My Store Map`)
  * **Map type** → Choose **JavaScript** for web use
  * **Raster or Vector** → Select **Vector** for modern styling (recommended)
* Click **"Save"**

Your **Map ID** is now generated ✅

***

#### 4. (Optional) Associate a Map Style

You can see the **Map styles** section with two cards: **Light mode** and **Dark mode**, both set to **"Google default"**.

To change the style, click the **✏️ pencil icon** on either card:

* **Light mode pencil:** assign a custom style for light mode
* **Dark mode pencil**: assign a custom style for dark mode

This will let you pick from existing styles.

<figure><img src="https://2498163780-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2LxG3rPCoA6sZo7ovFkR%2Fuploads%2FM34nOUUiDvYgHCRojiVi%2FCapture%20d'%C3%A9cran%202026-02-20%20102332.png?alt=media&amp;token=ca5de12a-35f3-4a3e-92f2-5f009e599e60" alt="" width="563"><figcaption></figcaption></figure>

***

#### 5. Create a custom style

* Go to **Map Styles** on side menu
* Click **"+ Create Style"**
* Customize it and save

{% embed url="<https://developers.google.com/maps/documentation/javascript/cloud-customization/map-styles>" %}

* Come back to your Map Id and assign it via the pencil icon

{% hint style="info" %}
Need help? Check [Google's Maps Platform](https://developers.google.com/maps/documentation) documentation for detailed setup guides.
{% endhint %}