Skip to content

How to Create a Google Map ID for MyHome

Create a Google Map ID in the Google Cloud console and add it to MyHome, so your property maps render with Google's modern advanced markers instead of the old ones.

2 minute read

A Google Map ID is a unique identifier that represents a single instance of a Google Map. MyHome uses it to enable Google's AdvancedMarkerElement, which powers the modern marker UI on your property maps. Without a Map ID, advanced markers will not display correctly.

Close-up of a street map around Bushwick with three rounded price markers reading $1,300,000, $1,000,000 and $500 /month.
Advanced markers are the rounded price pills MyHome draws on your maps.
Before you start
  • A Google Cloud project with billing enabled
  • The Maps JavaScript API active on that project
  • Your Google Maps API key already added in MyHome

If any of that is still missing, work through How to Enable Google Maps and Get a Google Maps API Key first, then return here.

Step 1: Open Map Management in Google Cloud

Go to the Google Cloud Console and make sure the correct project is selected in the top bar (the same project your Maps API key belongs to).

In the search bar at the top, type maps and open Google Maps Platform.

Google Cloud console search box with "maps" typed in; the Top results list shows "APIs & Services — Product page · Google Maps Platform" and "Google Maps Platform — Product · Real-world insights and location experiences".

In the left sidebar, click Map Management.

Left sidebar of the Google Maps Platform console with the Map Management entry highlighted, directly below Solution Library.

Step 2: Create a new Map ID

On the Map Management screen, click Create map ID at the top.

"Map management" page heading with a "+ Create map ID" button next to it.

Step 3: Fill in the details

In the Create new map ID form:

  • Name: Enter any name that helps you recognise it, for example MyHome Map.
  • Description: Optional. Leave it blank or add a short note.
  • Map type: Select JavaScript.

After selecting JavaScript, two rendering options appear below the dropdown:

  • Select Vector and leave Raster unselected.
  • Leave the Tilt and Rotation checkboxes unchecked.
Vector rendering is required
Google's advanced markers only work with vector maps, so the Map ID has to be created with Vector rendering.
"Create new map ID" form with Name set to "MyHome Map", an empty Description, Map type set to JavaScript, the Vector radio button selected rather than Raster, and the Tilt and Rotation checkboxes unchecked.

Then click Save.

Step 4: Copy the Map ID

After saving, you are taken to the details screen for your new map. Here you will see:

  • Name: MyHome Map
  • Map ID: a long string of letters and numbers
  • Created and Last updated timestamps, plus a map preview below

Copy the value next to Map ID.

Details screen for the map named MyHome Map, with the Map ID value partly blurred out, Created and Last updated both reading "Just now", and a Map preview section below; a green arrow points at the Map ID.

Step 5: Paste the Map ID into MyHome

In your WordPress dashboard, go to MyHome Panel → Settings → Maps.

Scroll to the Google Map ID field and paste the value you copied. Save your settings.

MyHome Panel settings on the Maps tab: Map provider set to Google, a masked Google Maps API key, Map language English, and an empty Google Map ID field described as enabling Google AdvancedMarkerElement support.

That's it. MyHome will now use the Map ID to render maps with Google's modern advanced markers.

Ask the people who build MyHome

We answer by email from support@tangiblewp.com. With Premium Support, we also fix your site when something breaks.

Was this guide helpful?