Question

我需要在WP的联系页面上放置一个样式化的地图。我宁愿不使用插件，因为它会过度杀戮，嵌入其他方式将不允许我自定义图层，使用占位符等

我在静态html页面上编写了一个示例地图。 https://dl.dropboxusercontent.com/u/13823768/map/test.html

如何从这里到wordpress？

编辑：我正在使用子主题，所以我把它放在functions.php中（在我的子主题目录中）

function enqueue_custom_scripts() {
    wp_enqueue_script('google-map-api','https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&amp;language=it');
    wp_enqueue_script('google-map-style', get_stylesheet_directory_uri() . '/js/map.js', array(), '1.0.0', true );
}
add_action('wp_enqueue_scripts', 'enqueue_custom_scripts');
?>

到目前为止看起来还不错，但它也需要<body onload="initialize()">。你知道如何将onload添加到body标签吗？

Answer 1

您可以通过创建自定义主题页面模板来完成此操作：http://codex.wordpress.org/Page_Templates或者只需在页面编辑器的WSYWYG内容区域的“文本”视图中添加#map_canvas元素。

下一步是添加所有的地图脚本，我会通过在wp_enqueue_scripts操作http://codex.wordpress.org/Function_Reference/wp_enqueue_script上创建一个回调函数，在主题的functions.php中对脚本进行排队。你将添加到functions.php的函数看起来像这样（用你的脚本替换文件路径）：

/**
 * Proper way to enqueue scripts and styles
 */
function theme_name_scripts() {
    wp_enqueue_style( 'style-name', get_stylesheet_uri() );
    wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

我知道你提到不想要一个过度杀戮的插件，但插件允许你的代码的可移植性，并允许你切换主题而不会丢失你的地图代码。添加插件和短代码来渲染#map_canvas元素不会比将代码添加到functions.php中的时间多得多。如果您有兴趣编写自定义插件，http://codex.wordpress.org/Writing_a_Plugin

在wordpress的联系页面上自定义谷歌地图

1 个答案: