Edit the sample Google map in the Contact us page:
To edit the sample Google map in the Contact us page, please follow the steps below:
Step 1:
First of all it isn't an image, but an Embed Map.
Step 2:
Please go to Google My Maps https://www.google.com/maps/d/ > Create a new map
Step 3:
1) Once you've found the right location
2) Please go to the Settings' icon in the top left corner
3) Click on the "Share or embed map" option
4) Click on the "Embed map" tab
5) You can choose the map's size from the drop-down menu: Small | Medium | Large | Custom size. Please choose Custom size
6) Custom sizes are: width="1600" and height="430"
7) Please copy the embed code
Step 4: Once you have the correct Embed Map,
8) Please add the script to the Header Featured Area field
9) Turn ON the Full Width Header Featured Area
Step 5:
In order to have the full width in any screen size, please edit the width to 100%, as shown on the screenshot below:
Step 6:
Please hit the "Update" button in the top right corner of the page to save the changes.
How to have a multi location Google map with custom icons?
If you need to have a multi location Google map with custom icons on your website:
you can use Google Maps engine and then embed the code into the theme, as described in the steps above.
Here are two links to the official Google documentation:
https://docs.google.com/a/veniko.com/document/d/1wYIIPkCm6qqadFheQwh6ko2mh2LttLjf69Orzi1TiKU/edit