Previous post about Google’s My Maps explained new online tool to create personalized or customized maps.
Google is still updating this My Maps tool. There is a new great feature that allows you to embed your custom or personal maps into your website. You can just copy/paste a string of HTML code to have your map on webpage. And this map will be totally interactive with zoom in/zoom out, different views, etc.
Google provides HTML code that shows map in iframe. That means you can customize of the embedded Google Map such as size, frame border, scrolling, etc.
Let’s take a look at Google My Maps to see how to embed custom maps into webpage.
1. Create custom Google Map you would like to have on your website. Use My Maps tab on http://maps.google.com/ . You will need Google account.
2. Click on ‘Link to this page’ in right top corner of your custom map.
3. You will see window with new field ‘Paste HTML to embed in website’.
4. Customize HTML code if required (height, width, scrolling, etc).
5. Just copy HTML code located in this field and paste on webpage in place where you would like to have your custom map.
6. Check your updated webpage to be sure that Google Map looks correct.
7. Done!
This new way to embed custom maps into webpages will make Google Maps more popular and more usable.
There are some limitations. Google Maps are available in some countries only and require Google Account to create custom maps.
