How to add Google Maps to your website?

A picture is worth a thousand words is a proverb that refers to the idea that a picture can explain a complex situation in more meaningful way than 1000 or more words.

You can see more details on this proverb by following the above link but we are here talking about slightly different topic. A map is worth telling 1000 ways to reach certain place. I guess 1000 doesn’t match with this proverb which i just created :-) but map really gives you clear picture and location of your destination.

It is very good practice to provide map of the place on your website if you want to let people know about your contacts and want that they should visit your location or office.

Earlier maps on websites used to be static and you could not interact with maps to zoom and explore different directions etc. But now in the Era of Ajax and Google Maps and other similar websites, it is very much possible to use map information for common use.

Other than visiting these maps related websites you can also embed the related map of related place in your website.

In starting, it was slightly tricky to embed Google maps in your website and you needed an application key for that which introduce another step towards including maps in your website but now it is probably easier than writing an email.

1. Go to maps.google.com
2. Search for the location
3. Once you think that final location is in middle of map with appropriate zoom level, click on ‘Link to this Page’ on right top of map.
4. It will open a small window there which will give you two things:

5. Copy and paste this HTML in your website and That’s it.

You can further customize by clicking ‘Customize and Preview embedded Map’ and it will let you choose the size of map according to your need or space requirements on your website and then you can copy and paste HTML in Text area below the preview.

See How it will look like:


View Larger Map

Most Commented Posts

If you enjoyed this post, please consider to leave a comment or subscribe to the feed and get future articles delivered to your feed reader.

Comments

No comments yet.

Leave a comment

(required)

(required)