API Google Map API в WordPress без плагина?

Я ищу, чтобы просто добавить карту google с помощью Google Maps api на одну из моих страниц в WordPress. Есть простой способ просто скопировать и вставить код карты «Hello, World» где-нибудь, чтобы карта отображалась на странице?API Google Map API в WordPress без плагина?

благодаря

источник

2012-07-24 Sam Creamer

Да, нет никакой необходимости в плагине для чего-то вроде этого. Прежде всего, вы включили бы скрипт Google maps в header.php, или вы могли бы поставить его в очередь;

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>

Затем я обычно добавить следующее в header.php - это добавляет условный код в тег для страницы, содержащей только карты (в этом случае странице 374);

<body <?php if (is_page(374)) { echo 'onload="initialize()" onunload="GUnload()"'; } ?>>

А потом я хотел бы создать пользовательский шаблон для контактной страницы (как это страница карта, как правило, на) и в шаблоне для этой страницы включают в себя что-то вроде следующего. Да, это, вероятно, немного длиннее для образца кода, но я просто даю вам реальный пример, который содержит анимированный маркер, на который можно щелкнуть, чтобы показать адрес вашего клиента. Вы можете изменить встроенные размеры в соответствии с вашим дизайном, и вы также можете смещать карту так, чтобы маркер не был корректным.

<div id="contact-content"> 

      <script type="text/javascript"> 
      function initialize() { 

       var leeds = new google.maps.LatLng(53.80583, -1.548903); 

       var firstLatlng = new google.maps.LatLng(53.80583, -1.548903);    

       var firstOptions = { 
        zoom: 16, 
        center: firstLatlng, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
       }; 

       var map = new google.maps.Map(document.getElementById("map_leeds"), firstOptions); 

       firstmarker = new google.maps.Marker({ 
        map:map, 
        draggable:false, 
        animation: google.maps.Animation.DROP, 
        title: 'Your Client', 
        position: leeds 
       }); 

       var contentString1 = '<p>The Address<br />Of your client<br />in<br />here</p>'; 


       var infowindow1 = new google.maps.InfoWindow({ 
        content: contentString1 
       }); 

       google.maps.event.addListener(firstmarker, 'click', function() { 
        infowindow1.open(map,firstmarker); 
       }); 

      } 
      </script> 

      <div class="map"> 

       <div id="map_leeds" style="width: 600px; height: 600px"></div> 

      </div> 

     </div>

Если кто-то делает это другой, лучший способ, то я был бы заинтересован, чтобы увидеть его, но я использовал это на нагрузок сайтов, и она работает очень хорошо.

источник

2012-07-24 19:34:48 McNab

большое спасибо, очень полезно –

Мое удовольствие - рад, что вы нашли его полезным :) – McNab

API Google Map API в WordPress без плагина?

ответ

Смежные вопросы