[google maps] nambahin google maps pada blogspot anda

[google maps] nambahin google maps pada blogspot anda

Published on October 21, 2007, by ode in Komunitas Web.

Masih ingat cara nampilin google maps pada web html yang sebelumnya pernah saya tulis ? ( http://komunitaskami.com/newbie/belajar/web/web-nambahin-google-maps-di-situs-anda.html )

Ternyata buat nampilin Google Maps pada blogspot rada – rada susah juga, tapi akhirnya bisa juga.

Berikut tahapannya :

1. Edit template blogspot anda

Template > Edit HTML

2. Ganti tag

^?View Code PHP

&gt;&lt; html ....... &gt;&lt;/pre&gt; &lt;p&gt;dengan&lt;/p&gt; &lt;pre lang=">&lt;html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en' xmlns:v='urn:schemas-microsoft-com:vml'&gt;

3.? Tambahkan code berikut baris dibawah tag < head >

^?View Code PHP

&lt;style type="text/css"&gt; v\:* { behavior:url(#default#VML); } &lt;/style&gt; &lt;script language="javascript"&gt; function load() { if (document.getElementById("google_map_01") != null) { google_map_01(); } } function unload() { if (document.getElementById("google_map_01") != null) { GUnload(); } } &lt;/script&gt;

4. Ganti tag

^?View Code PHP

&lt;body&gt;

dengan

^?View Code PHP

&lt;body onload='load()' onunload='unload()'&gt;

5. Simpan perubahan ( click Save Templates Changes )

6. Buatlah sebuah artikel baru dan masukan code berikut pada HTML mode :

^?View Code JAVASCRIPT

&lt;script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=[masukan API key anda disini]" type="text/javascript"&gt;&lt;/script&gt;&lt;script type="text/javascript"&gt; function google_map_01 () { if (GBrowserIsCompatible()) { var mapid = "google_map_01"; var latitude=-8.666033; var longitude=115.197969; var zoom=14; var mymap_ctl = false; var map = new GMap2(document.getElementById(mapid)); var maptype = G_HYBRID_TYPE; var type_ctl = true; var map_ctl = true; map.setCenter(new GLatLng(latitude,longitude), zoom); map.setMapType(maptype); if (type_ctl) { map.addControl(new GMapTypeControl()); } if (map_ctl) { map.addControl(new GSmallMapControl()); } if (mymap_ctl) { var geoXml = new GGeoXml(mymap); map.addOverlay(geoXml); } } else { alert('Non compatible browser'); } } &lt;/script&gt;&lt;div id="google_map_01" style="width: 400px; height: 400px"&gt;&lt;/div&gt;