Help:Embed Google maps

From Emerald Forest Hotel
Jump to navigation Jump to search

→ Go! Help:Contents | Help:Linking other software


Embedding of a Google Map goes as follows.


Google account, prepare and create map

You have to have a Google account, and prepared & saved your map in your account including all landmarks, paths and correct zoom-level. Best is using Internet Explorer instead of Firefox.


Embed code

Maps is the online version of Google Earth which can/should be installed on your PC.

In Google Maps, click "Link" in the top right corner of the map which you have created. Copy the code under "HTML to use on website". This code is probably as follows:


<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps/ms?ie=UTF8&hl=nl&msa=0&msid=113777574629300401936.00046acfe0b08bf989e2d&t=h&ll=18.789419,98.984296&spn=0.007354,0.004399&output=embed"></iframe><br /><small><a href="http://maps.google.com/maps/ms?ie=UTF8&hl=nl&msa=0&msid=113777574629300401936.00046acfe0b08bf989e2d&t=h&ll=18.789419,98.984296&spn=0.007354,0.004399&source=embed" style="color:#0000FF;text-align:left">Chiang Mai</a> weergeven op een grotere kaart</small>


And in the platform...

Now in the platform (to embed your map) paste the code above and use ONLY the code in RED, and put this code between the tags {{#widget:Iframe |url=xxxxxxxxx}}


This will look like:

{{#widget:Iframe |url=http://maps.google.com/maps/ms?ie=UTF8&hl=nl&msa=0&msid=113777574629300401936.00046acfe0b08bf989e2d&t=h&ll=18.789419,98.984296&spn=0.007354,0.004399&output=embed}}


Resulting map:



Change zoom level

If you think the zoom-level of the map is not correct; add the following code AFTER the existing code: &z=15


Note: zoom-level can change between z=1 and z=17.


Resulting code (change in red):

{{#widget:Iframe |url=http://maps.google.com/maps/ms?ie=UTF8&hl=nl&msa=0&msid=113777574629300401936.00046acfe0b08bf989e2d&t=h&ll=18.789419,98.984296&spn=0.007354,0.004399&output=embed&z=15}}


Resulting map:


Google Maps/Earth hyperlinking

Of course if you want to make a link to Google Maps, you can

  • By making a hyperlink:

Map through this hyperlink


  • Embedding one more time:


You can find the exact hyperlink (so the exact address, unique URL) by clicking on your mouse (right side) and look for the properties of the map that are chosen.

You can add some extra's, for instance {width=425}{height=350}. This determines the width and the height (so together the size) of the map on your platform page.


{{#widget:Iframe |url=http://maps.google.com/maps/ms?ie=UTF8&hl=nl&msa=0&msid=113777574629300401936.00044dbc8748b718bdaef&ll=13.757327,100.502008&spn=0,0&output=embed&s=AARTsJpWi1MnhDWI2D5AeBTreZi2I80UEA |width=425 |height=350}}


While embedding a map, be sure that there is some continuity. As long as the map stays on Google maps/Earth, it will be uploaded every time in the platform by the link. If it disappears in Maps, it will not be shown in the platform.


Flickr photo in Google Maps

You can only embed a Flickr photo in a Google maps place mark, if you are fanatic: yes you can embed there as well. To do so chose HTML-format in the Google maps place mark and type: <IMG SRC="http://farm1.static.flickr.com/119/257178671_77a89bc655_m.jpg"> choose the right address of the picture/photo.

Blanks in names

If you embed a photo or something else, it is advisable not to have blanks (gaps) in the names of the files, for instance on YouTube, Flickr or Earth. Instead of blanks use underscores (_) or the minus sign (-): this is something special in the software. <no wiki> Do NOT use ' or * and & either </no wiki>. This will cause problems in the software.



→ GO! top of this page