Embedding a Google Map with multiple markers
Getting Started
In this documentation, you will learn the process required to embed a Google Map with Multiple Markers into your site. Follow all the steps accordingly to know the details.
Embedding Google Maps with Multiple Markers
Including a Google Map with multiple markers on your website can really help you if your business is present in more than one location.
To learn how to embed a Google Map with Multiple Locations on your site, follow all the steps below accordingly —
Create a Map & Get the Embed Code
Follow all the steps below, to learn how to create a map & get the embed code —
- On your computer, sign in to My Maps.
- Click on `Create a new map.`
- Go to the top left and click `Untitled map.`
- Give your map a name and description.
- Add multiple locations under Add Layer
- Click on `Share`
- Enable this toggle & close it
- Copy the Embed Code
The Screenshots & GIFS below show the whole process being demonstrated visually ⬇️
Once you signed in to My Maps, Click on Create a new map.
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-22_1bn1q1y.png)
Go to the top left and click "Untitled map."
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-23_mfg2nl.png)
Give your map a name & description and save it
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-24_1rryq42.png)
Add multiple locations under Add Layer
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/cm6-1_1dnfrf9.gif)
Click on Share
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-25_19h5vaj.png)
Enable this toggle & close it
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-26_y5yrp0.png)
Copy the Embed Code
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/cm7-1_168u5r7.gif)
Embed the code into your site
Follow all the steps below, to
- In your website builder, add a Custom Code element where you want to embed the map
- Click on `Edit Element`
- Paste the embed code under the HTML field
- Press Save & Publish
- To see the result, visit your site by pressing the button right next to Publish
The Screenshots & GIFS below show the whole process being demonstrated visually ⬇️
In your website builder, add a Custom Code element where you want to Embed the Map
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/gif-recording-2023-04-16-at-40_1di5kpv.gif)
Click on Edit Element & paste the Embed Code under the HTML field
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-27_1v4u81e.png)
Press Save & Publish and visit your site by pressing the button right next to Publish
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-28_tnkoe9.png)
Voila! Here is your Google Map with multiple markers
![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-29_1fym60z.png)
To know the whole process at one glance, refer to the video below ⬇️
Related Articles
Custom Code Element
Add Custom Code
Save, Preview, and Publish
Updated on: 31/10/2023
Thank you!