我希望使用 google maps api 简单地将 google map 添加到我在 WordPress 中的一个页面中。有没有一种简单的方法可以简单地将“Hello, World”谷歌地图代码复制并粘贴到某处以将地图显示在页面上?
谢谢
我希望使用 google maps api 简单地将 google map 添加到我在 WordPress 中的一个页面中。有没有一种简单的方法可以简单地将“Hello, World”谷歌地图代码复制并粘贴到某处以将地图显示在页面上?
谢谢
是的,不需要这样的插件。首先,您可以在 header.php 中包含 Google 地图脚本,或者您可以将其加入队列;
<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>
如果其他人以不同的、更好的方式来做,那么我很想看到它,但我已经在很多网站上使用过它,而且效果非常好。