How to embed a Google Map with multiple pins

To embed a Google Map with multiple pins on your website, you can use Google My Maps, a feature of Google Maps that allows for the creation of custom maps with multiple markers.

Here's a step-by-step guide:

1. Creating a map

1. Access Google My Maps:

• Navigate to Google My Maps.
• Sign in with your Google account.
  

2. Create a new map:
   

• Click on the "Create a new map" button.
  
• A new, untitled map will appear. Click on "Untitled map" to rename it as you like.
  

3. Add multiple pins (markers):

• Use the search bar to find a specific location or navigate the map manually.
• Click on the "Add to map"
• Repeat this process for each location you wish to add.
  

4. Customize your map:
   

• Change the base map
• Customize markers
  

5. Share and embed your map:

• Click on the "Share" button to set the map's visibility.

Make sure all toggles are activated:

• To embed the map on your website:
• • • Click on the three-dot menu next to the map title.
    • Select "Embed on my site"

• • • Copy the provided HTML code.

2. Embedding on your website

1. Add a Custom HTML Component to the page where the map will be:
   
2. Paste there the code from the previous step
   Insert specific HTML tags before and after the code to center the map horizontally:

And that's it! By following these steps, you can combine multiple location pins into a single map for display on your website.

F.A.Q.

How to integrate Google maps
How to embed a Google Map dynamically for each page

Updated on: 24/03/2025