---
title: Map Block
description: "The PublishPress Map blockis available in the [PublishPress Blocks](https://publishpress.com/links/blocks) plugin. This allows you to display a Google Map in the Gutenberg editor. You can create maps with custom icons, tooltips, description, zoom levels and much more. ![](https://publishpress.com/wp-content/uploads/2020/05/map-block-1.png) --- ## Configure…"
url: "https://publishpress.com/knowledge-base/map-block/"
updated: "2025-05-14"
category: PublishPress Blocks / PublishPress Blocks
---

# Map Block

The PublishPress Map blockis available in the [PublishPress Blocks](https://publishpress.com/links/blocks) plugin. This allows you to display a Google Map in the Gutenberg editor. You can create maps with custom icons, tooltips, description, zoom levels and much more.

![](https://publishpress.com/wp-content/uploads/2020/05/map-block-1.png)

---

## Configure Google API Key

To use the PublishPress Map block, you need to add a Google API key in the [PublishPress Blocks](https://publishpress.com/links/blocks) [Settings](https://publishpress.com/knowledge-base/configuration/#h-maps) screen.

![](https://publishpress.com/wp-content/uploads/2022/10/Screen-Shot-2022-10-05-at-17.39.59.png)

[Click here for Google's official guide to getting an API key](https://developers.google.com/maps/documentation/javascript/get-api-key). They ask you to do the following:

1. Go to the [Google Cloud Platform Console](https://cloud.google.com/console/google/maps-apis/overview).
2. Click the project drop-down and select or create the project for which you want to add an API key.
3. Click the menu button and select **APIs & Services > Credentials**.
4. On the **Credentials** page, click **Create credentials > API key**. The **API key created** dialog displays your newly created API key. Click **Close.**
5. The new API key is listed on the **Credentials** page under **API keys**.

Once you have added your API key, you can create the map by clicking on the **Map** button in the PublishPress Blocks category:

Important: in the [API Library](https://console.developers.google.com/apis/library) you need to enable 2: Maps JavaScript API and Geocoding API. You can do this adjustment after creating the API key.

---

## How to add a PublishPress Map block

To create a PublishPress**Map** block, click the "Map – PublishPress" button in the PublishPress Blocks category.

![](https://publishpress.com/wp-content/uploads/2022/10/Screen-Shot-2022-10-05-at-17.41.13.png)

---

## Settings for the PublishPress Map block

From the right panel, you can add a location in two ways:

1. Input the Latitude and Longitude, or
2. Enter an Address and then press the "Fetch Location" button.

Some additional options for the map are available:

- **Zoom level**
- **Height**
- **Marker Icon**
- **Marker Title**
- **Marker description**
- **Open marker tooltip**
- **Map styles: **silver, retro, night, ... and you can add your custom style also.

![](https://publishpress.com/wp-content/uploads/2022/10/Screen-Shot-2022-10-05-at-17.42.34.png)

---

## Default settings for all your PublishPress Map blocks

You can set default options for every PublishPress Map block added to your site. This is possible with the [PublishPress Blocks default configuration](https://publishpress.com/knowledge-base/default-blocks-config/) feature and it allows you to create a consistent look-and-feel for all your maps.

- Go to **Blocks** in your WordPress admin menu, then **PublishPress Blocks**.

- Click ****Map**** settings icon.

![](https://publishpress.com/wp-content/uploads/2022/10/Screen-Shot-2022-10-05-at-17.43.37.png)

- Adjust the default settings and save.

![](https://publishpress.com/wp-content/uploads/2022/10/Screen-Shot-2022-10-05-at-17.43.53.png)