Note: While our most popular guides have been translated into Spanish, some guides are only available in English.
Using the Map Block

The Map Block embeds a Google Map with a location pin on your site. This is a great way to display your business or event's location. It's popular to add the Map Block to a Contact page.

Note: Map Blocks can only display one location pin. To create maps for multiple locations, add multiple Map Blocks to a page.

Step 1 - Add the Map Block

  1. Open a page or post editor.
  2. Click an Insert Point or the +.
  3. Select Map from the menu.
  4. For more detailed steps, visit Adding blocks.

Step 2 - Add a location pin

  1. In the Map Block Editor, enter an address to display in the Map Block. When you start typing an address, the page populates a list of autocomplete suggestions powered by Google. The Business Name helps find the address, but it doesn't display on the Map Block itself.
  2. Press the Enter/Return key to drop a pin of your location onto the Map Block.
Tip: Drag and drop the pin while the Map Block Editor is open to refine the pin location. 

Map_Block.jpg

Step 3 - Change the design

Click the Design tab and follow these steps to change the color scheme of the map.

Change the map color

Click the color drop-down menu to select one of the following options:

  • Original - Classic Google Maps design
  • Grayscale
  • Satellite
  • Minimal Dark
  • Minimal Light
  • Minimal Blue - Displays water in blue and the rest of the map in white.

Add more layers

Check the options below to add more layers to the map.

  • Show Labels - Display location names
  • Show Terrain - Display terrain features
  • Show Controls - Display zoom, direction arrows, and map scale

Step 4 - Change the size

Change the Map Block's height by clicking and dragging the bottom handle.

Tip: Press and hold the Shift key while dragging the handle to resize the map in 20 pixel increments. This can help align the bottom of the map with another block.

When the Map Block is in a column next to another Block, you can adjust its width with the side handles.

Step 5 - Change the zoom

Visitors can zoom in by double-clicking anywhere on the Map Block and zoom out by pressing and holding Control on their keyboard while double-clicking on the map.

To change the default zoom level:

  1. While the Map Block Editor is open, zoom to your desired level, then click Apply.
  2. On a Mac, you can use two-finger trackpad scrolling to zoom in and out.

FAQ

Can I add multiple location pins to the map?

Map Blocks can only display one location pin. To create maps for multiple locations, add multiple Map Blocks to a page.

The Map Block is resizing and hiding the pin on mobile devices.

This is expected behavior. The Map Block resizes responsively based on browser size. While this helps with your site's mobile appearance, it sometimes hides the pin on smaller browsers. If you're viewing on a desktop browser, try expanding the browser window to reveal the pin.

Preview how your map looks on smartphones and tablets with Device View.

The Map Block is displaying incorrect information.

If you see incorrect information, you can report it to Google directly from the block. Click Report a Map Error in the bottom-left corner of the map.

Was this article helpful?
33 out of 83 found this helpful
Using the Map Block