Pages

Tuesday, 30 July 2013

Way to embed a google map to your website


https://www.youtube.com/watch?v=C8oykuBC0HA&t=2s
Hey friends, this is hardik jain. Today i gonna share you the way, how to embed a google map ? for a specific location address in your own website page using iframe.

Step 1: First of all go to below link:

https://maps.google.co.in/


Step 2: Now Type full address of (your company or home or building) which you want to show in map.
inside the google search textbox and click on search button as shown below in below snap:
















Step 3: Now just below that text box you will see a link tab as highlited in below snap. just click it.














Step 4: Now you would see a below popup,in which just copy the link(an iframe tag) given inside below textbox.


 

 Step5: Paste this iframe tag inside body of your web page as shown below.


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.in/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Newcon+Infosystems,+RNT+Marg,+Chhoti+Gwaltoli,+Indore,+Madhya+Pradesh&amp;aq=0&amp;oq=newconinfosys&amp;sll=22.717152,75.871829&amp;sspn=0.001403,0.002642&amp;ie=UTF8&amp;hq=Newcon+Infosystems,&amp;hnear=RNT+Marg,+Chhoti+Gwaltoli,+Indore,+Madhya+Pradesh&amp;t=m&amp;ll=22.717152,75.871829&amp;spn=0.006295,0.006295&amp;output=embed"></iframe>
    <br />
    <small><a href="https://maps.google.co.in/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=Newcon+Infosystems,+RNT+Marg,+Chhoti+Gwaltoli,+Indore,+Madhya+Pradesh&amp;aq=0&amp;oq=newconinfosys&amp;sll=22.717152,75.871829&amp;sspn=0.001403,0.002642&amp;ie=UTF8&amp;hq=Newcon+Infosystems,&amp;hnear=RNT+Marg,+Chhoti+Gwaltoli,+Indore,+Madhya+Pradesh&amp;t=m&amp;ll=22.717152,75.871829&amp;spn=0.006295,0.006295" style="color:#0000FF;text-align:left">View Larger Map</a></small>
    </div>
    </form>
</body>
</html>

step 6: Press F5 to run the code and enjoy.........




























1 comment: