How To Add Google Map To Website

How To Add Google Map To Website

Well, you need not to be a programmer to add Google map in your website or blog. Let’s see how you can add Google map location into your website or at contact us page. Assuming you have basic knowledge of HTML.

Embed Google Map in WebSite:

  1. Open maps.Google.com.
  2. Search the location which you would like to add in your website.
  3. Look at Link button next to printer and click on it.
  4. It will open pop in from where you can get link of your map to share.
  5. You can share the link as well as you can embed it in html using Iframe element.

How to embed iframe in html

  1. From above steps you have copied Iframe text.
  2. Now, open your HTML page to edit.
  3. Insert or paste the embedded source of your map.

Description: Once page start  rendering of Iframe, it will call source of Iframe. Inside that source you can see actual location in map.

Example

In below map I have added sample map. It shows New York location on map. I have used below code in my html.

<iframe width="425" height="350" 
frameborder="0" 
scrolling="no" 
marginheight="0" 
marginwidth="0" 
src="https://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=new+york&aq=&sll=18.52043,73.856744&sspn=0.271176,0.308647&t=h&g=pune&ie=UTF8&hq=&hnear=New+York&z=10&ll=40.714353,-74.005973&output=embed">
</iframe>

View Larger Map

View Larger Map

Note: You may have website listening on secure https:// port 443. In this case change your source Url to
HTTPS://maps.google.com

Now, you are ready to display the required location on your website.

Google maps are free, if you are not using it for commercial purpose.

You can also get exact location on map by sending longitude and latitude to Google API.

How to track vehicle on map programmatically:

As a developer you may get requirement to track location of vehicle or mobile on map. It’s very simple what you need to do is collect GPS (Global Positioning System) co-ordinates from tracking device to your Website or WebService.

Once you have those data in your database, you can send those longitude and latitude to Google API and get location of it on map.

If it’s commercial application you need to pay for it to Google else you can use it free.

Tags:

How to use Google analyticsBlogger SitemapDisable Google Suggesthow to open a blog websitehow to remove Google ChromeGoogle JQuery CDNGoogle Online calculator and other functionality to convert units.Google applications single sign onkeywords not provided Google analyticsGoogle – Search settingsHow To Open Blocked Websites

Author

My name is Satalaj, but people call me Sat. Here is my homepage: . I live in Pune, PN and work as a Software Engineer. I'm former MVP in ASP.net year 2010.
Disclaimer: Views or opinion expressed here are my personal research and it has nothing to do with my employer. You are free to use the code, ideas/hints in your projects. However, you should not copy and paste my original content to other web sites. Feel free to copy or extend the code.
If you want to fight with me, this website is not for you.
 

I'm Satalaj.