Categories

Featured templates

HTML. How to change Google Map location

Chris Diaz October 24, 2011
Rating: 4.5. From 4 votes.
Please wait...

The following tutorial will show you how to change the google map location in the HTML based template. Due to the common pages structure the tutorials is also valid for such template types as Full Site, Full Package, JS Animated, Static Template.

Usually the google map is located at the Contacts page. Let’s see how you can display your location there. First of all open your template folder and go to the site directory. There you can see several html files (index.html, index-1.html etc) or a single html file. In any case HTML files contain the content of your template pages.

Open any index file with your browser and click on the Contacts button. In the address bar you should see the page filename. Open it with your HTML editor (Adobe Dreamweaver, Notepad etc). Scroll down or using the search tool (CTRL+F) search for the iframe tag. Google Map is usually embedded into the page using the following construction:

<iframe  width="312" height="210"  src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Brooklyn,+New+York,+NY,+United+States&amp;aq=0&amp;sll=37.0625,-95.677068&amp;sspn=61.282355,146.513672&amp;ie=UTF8&amp;hq=&amp;hnear=Brooklyn,+Kings,+New+York&amp;ll=40.649974,-73.950005&amp;spn=0.01628,0.025663&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe>

So to put your map here please perform the following steps:

  1. Visit maps.google.com
  2. Select your location and zoom
  3. Click the link icon in the top right corner and copy the Paste HTML to embed… field
  4. Paste the code into your contact page html file replacing the existing one
  5. Edit the map dimensions (width="312" height="210")
  6. Save the file and refresh the page in browser

That’s all, now you should see your updated google map.

 

This entry was posted in Working with HTML and tagged google map, HTML, location. Bookmark the permalink.

Submit a ticket

If you are still unable to find a sufficient tutorial regarding your issue please use the following link to submit a request to our technical support team. We'll provide you with our help and assistance within next 24 hours: Submit a ticket