Since the beginning of time, embedding Googlemaps or Yahoo! Maps has always been a royal pain the behind. Since Yahoo! doesn’t offer any maps of Singapore, we’ll only cover how to embed a Googlemap on to your website or blog.
They have made it so simple, you got to be crazy to use streetdirectory.com.
Previously, you had to:
- Get your own Googlemaps API
- Find the geographical coordinates by ripping it off the browser’s location bar
- Substituting the coordinates and zoom level into some obfuscated code
- Pasting the code onto your site
Christian Heilmann and Mark Norman Francis’s book Web Development Solutions has a short section on how to embed Google Maps via microformats, but it’s still not as easy as it should be.
- Log into Google Maps with your Google login
- Click on “My Maps” on the left sidebar and choose “Create Map”
- Use the tools to markup your map. Drop markers, draw lines, go crazy.
- When you’re done, save the map, click on “Send” on the top right of the map. Cut and paste the code in “Embed in website” in the popup.
Easiest way to embed Google Maps on your blog.
Comments
Cool! I ll try that sometime, although I don’t think it will validate for xhtml strict (since it uses an iframe)…
Posted by: Nils Hendriks | September 10, 2007 5:41 PM
What about embedding it into your web site, say progammatically on Rails or PHP? I think it will be great if you have a walkthrough for that.
Posted by: raynor | September 15, 2007 2:04 PM
Hi, I’m new here!
Anyhow, have you seen this article? It’s crazy, and there are pictures!
Posted by: FreddieMercury | August 4, 2008 4:43 AM
Good article. I have done it with using ‘EmbedIt’ wordpress plugin. http://busysphere.com/2008/08/embed-google-map-in-your-wordpress-blog/
Posted by: Enbee | August 13, 2008 2:35 PM