How to embed a Google map on a webpage

On April 23, 2014

Categories: HTML/CSS, Quick Web Tips

Google recently changed their Google’s map in favor of a new way of doings things.   While it’s nice it has also stepped away from some of the used features on users and tucked them away in favor of other new features, such as collaborating and sharing maps with friends via Google+.

So if you’re looking to embed or place a map of a location on your website using the new Google Maps here are the steps you need in order to accomplish what you need.

First head over to the Google’s map and search for the address or location you want to embed on your website.

Once you plot or search for the address and it’s visible to you on the map click on the “Settings”  looks like a little Gear.  Then choose “Share and embed map”.  You will see this little GEAR towards the bottom right of the page.

sharring_google_map

Finally, select that tab that reads “Embed Map” and choose the appropriate map size you want to place on your website.   If the sizes offer do not work for you simply modify the “width” and “height” attributes of the URL provided by Google to make your own custom sizes.

embedding_google_map

This short guide on how to embed a google map on your website should help you now to get what you need on your website.