2014-07-22 05:57
浏览 68


I am new to google maps api and am using it to put a map on my wordpress page and get the location of the user. So far, I have kept the following code in my header.php file with myapikey replaced with my actual api key.

<script type="text/javascript"

I also have a wordpress page with the following code. This code works when I keep it on a html file. However, when I put this code on my wordpress page, I don't even get the map to show. I am using Google Maps API v3 Geolocation. Could someone please help me.

<!DOCTYPE html>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta charset="utf-8">
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0px; padding: 0 }
      #map-canvas { height: 100%; width: 100%; top: -100px;}

    <script type="text/javascript">
      var map;

      function initialize() {
        var mapOptions = {
          zoom: 12
        map = new google.maps.Map(document.getElementById("map-canvas"),

        //Html five geolocation
        if(navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
            var pos = new google.maps.LatLng(position.coords.latitude,

            var infowindow = new google.maps.InfoWindow({
              map: map,
              position: pos,
              content: "HTML5 is used."

          }, function() {
        } else {
          // Browser doesn't support Geolocation
      function handleNoGeolocation(errorFlag) {
        if (errorFlag) {
          var content = 'Error: The Geolocation service failed.';
        } else {
          var content = 'Error: Your browser doesn\'t support geolocation.';

        var options = {
          map: map,
          position: new google.maps.LatLng(60, 105),
          content: content

        var infowindow = new google.maps.InfoWindow(options);

      google.maps.event.addDomListener(window, 'load', initialize);
    <div id="map-canvas"/>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • douhuantui6259
    douhuantui6259 2014-07-22 22:13

    You can't paste the complete document into the editor, what you put into the editor is expected to be te content of your page, it may be almost anything that you would put into the of a HTML-page(no html, head and body).

    script and style always include either via the header/footer of the theme or via a plugin.

    点赞 评论