Until very recently, the answer would have been “no, sorry” or “not without some serious hacking”, but Google’s just opened up its terrific Google Maps application in a way that makes this task fairly straightforward, whether your target is a Facebook or MySpace profile, a blog entry, or even a traditional Web page or site.
The first step you’ll need to take is to go to Google Maps and map an address, either of your office, your home, your favorite restaurant, whatever. I mapped the location of some house or the other that our tax dollars help paint every few years:
The key is to now click on “Link to this page” on the top right, which pops up a small window that contains two links:
The second of those two links is what you’d want to cut and paste, and the result would look like this:
View Larger Map
Nice, but truth be told, I’d prefer it were a bit smaller if I am going to include it on a Web page, so click on “Customize and preview embedded map” and you’ll get a new window with a variety of options:
Now I can choose “Small” and grab the resultant code at the bottom of that page. The result? Here we go:
View Larger Map
Nicer. Anyway, whatever size you want, you now have a slick way to add a Google Map to your Web page (or blog entry, as demonstrated in this very article). Good luck!
31 thoughts on “How can I embed a Google Map on my Web page?”
I have been struggling to get Google Map embedded in my website but now i got it Thank you so much!
Thank you so much, wow that was so easy, and to think I’ve tried a lot of different methods and none of them worked. Again thanks a lot!
Thanks, Dave! I hope this time it will work. I am struggle to have a good map for the city and looks like Google map is the best.
Thanks for sharing nice resource with step by step example about how to add gmap ….It is more helpful to all beginners thanks dude…
nice postings thanks for sharing,,,, about how to add google map in our site with image example…keep continue your postings…great efforts
thanx
This works! Google’s instructions said to go to My Places, and then Create Map. The problem was that I kept getting an error, “map cannot be embedded.”
Your method is much easier, and more importantly: it WORKS!
Thank you!
need code to google map
Dear Dave,
I have been struggling to get Google Map embeded in my website until I read and used your way to get it. Thank you so much for sharing this!
I am a website designer and this was really helpful for my recent project.
Thank you so much!
Very helpfull tip, I found you in google so fast, and take 10 minutes to build a map for a customer, next, will be in my website.
Thanks!!!!
Hi Dave,
I’m in the process to create a free access website that will help people to visit an area ( Building, Parks, Attraction, etc}.
I would like to include a map with the step by step visit of this area Like the “My Maps” from google, with lignes and shapes and pictures.
In addition, in the website in order to make some money I would like to integrate affiliates programs like, Hotels.com, concert tickets sale, city pass, and Google.Adsense,
I was wondering if you could help me to know if Google accept embedded “My Maps” on this kind of website with affiliate program or is there a fee to pay?
Are you considering this kind of website Professional?
I read Google terms and policy but i’m not clear.
In advance thank you for your help.
Bruno
these info has helped a lot to decipher how to add google map to webpages…this is very good
I Am doing my Final Year Project of MTech Embedded system. In my project it having website. For web designing i am using visual studio dot net. How the google map embedded in the web page that will created under the dot net plateform?
it is not working in ie7.can anybody help me..
Hey, thanks a lot, it was really confusing trying to decipher how to add a map on google maps. This is a very easy way!!!
thnx a lot.very useful information
thank you sooooo much dear…. u rock man… gud luck…
I have a blog, I want to have a map in it AND be able to have people add things to it that builds and builds. Can I do this?
No professional business or company would use a Google map API even the enterpise version you pay for is not that great. Google have just lost their licence for postcode’s in the UK and already companies have seen issues with the Free platform (which is the basic service) and not very flexible.
Top mapping tool must be ViaMichelin.
A independant poll carried out by the IMA said
1. ViaMichelin
2. Mappy
3. Microsoft
4. Yahoo
5. Map 24
6. Google
Poll was based on brand, quality, customisation, coverage, support, SLA, price, usability, speed, and 17 other criterias.
Hi,
I am trying to implement a google map search in my website but the search button for some reasons doesn’t work when I tried to search for any specific address.My map is in derived pages coming from master pages. Can you give me any clue?
Thanks for help and if you could write me back in email
Thanks for the tutorial, it helped!!!
I HAVE A WEBPAGE AND HOW CAN I SEND IT OR EMAIL IT TO ANOTHER PERSON BECAUSE ON THE WEBPAHE THERE IS NO PLEASE TO PUT AN EMAIL ADDRESS>
SECOND, IF I OPEN MY COMPUTER, HOWWWw TO I FIND MY WPBAGE?
I need search base google map for my website and blog how to get it?
thank you
If you want to instantly embed popup Google Maps for all the locations on a page, try MapMyPage. MapMyPage is the fastest, easiest way for bloggers and website owners to add Google Maps to any website. Just copy one line of JavaScript into a web page and MapMyPage will automatically add Google Maps to all the locations mentioned in the page.
http://www.mapmypage.com
Hi,
Tried to embed google map at site I’m developing and received the following error message upon display: Forbidden
Your client does not have permission to get URL /maps?f=q&hl=en&geocode=&q=Brian’s+Custom+Framing+and+Art+Gallery,+201+Wolf+Street,+syracuse+NY&ie=UTF8&layer=c&cbll=43.069852,-76.165248&panoid=tp8gVYl0Wdki85NNkSY6SA&cid=43069868,-76165251,1460987307468310944&s=AARTsJpxcdXb1rxOEOcmbhcXfCy9uTuFnQ&ll=43.070769,-76.163063&spn=0.01881,0.025749&z=14&output=embed from this server. (Client IP address: 74.71.96.176)
Is there anything I can do to display map? I’m using Dreamhost as a hosting service…is that why? Thanks, Amy
Is there a way to get the directions localized on an embeded page as opposed to the directions taking you to the google maps page upon search? I’d like the results to stay on my page.
MySpace will not support the functionality (right too – people could do alot of damage if they did) – There is no way to add this to myspace, they may release an application or embeded custom object that allows you to so (this would stop the security risk) but as of now, your best bet is to make an image of the map, link it to google maps externally.
I can’t get this to work on myspace because it uses iframes which are prohibited on myspace. Any luck on finding a way to use it on myspace?
Embedding Google maps doesn’t work on MySpace!
After reading through the maps API documentation numerous times trying to figure out how to embed a ‘my map’ on a page, I was pointed to your article and it worked like a charm — not to mention much much easier than working with the API. Thanks!!
dc