WordPress集成的Google地图代码片段/JavaScript/CSS粘贴位置

时间:2016-03-28 作者:javaandy

我这里有一把JS小提琴:

http://jsfiddle.net/geocodezip/50g6vgns/1/

当我将所有代码粘贴到WordPress页面的文本区域时,它没有正确显示。

对于Google地图库的外部资源,我将其添加到函数中。php

add_action(\'wp_head\',\'my_addition_js\');

function my_addition_js() {
    echo \'<script src="https://maps.googleapis.com/maps/api/js" type="text/javascript"/>\';
}
将html、css和javascript以不同的顺序粘贴到WordPress页面的文本/正文中,使用不同的标记、不同的主题,我不会让你感到厌烦,因为我确信我只是把代码放错了地方。是,使用文本不可见。

我应该在哪里将代码粘贴到小提琴中,以使其在WordPress中工作?

执行我添加到函数中的操作。php看起来还好吗?javascript放在第一位还是最后,或者我是否将样式放在样式中,这是否重要。css?

我最多只能看到模板边栏,但没有地图,但我已经改变了方向,现在甚至看不到模板。

谢谢你的帮助。

1 个回复
最合适的回答,由SO网友:Adam 整理而成

fiddle中的JS应该保存到一个文件中,例如,scripts.js. 如果它位于主题根目录中的文件夹中,则称为js 您可以按如下方式将脚本排队:

function add_wp_scripts() {
    wp_enqueue_script(
        \'google-maps\',
        \'https://maps.googleapis.com/maps/api/js\',
        array(),
        null,
        null
    );
    wp_enqueue_script(
        \'script\',
        get_template_directory_uri() . \'/js/script.js\',
        array(),
        null,
        true
    );
}
add_action( \'wp_enqueue_scripts\', \'add_wp_scripts\' );
最后一个参数设置脚本是否加载到<head> 或在</body> 标签Null将脚本放置在<head>, 显然,将参数设置为true 会把它放在</body>.

脚本应该很好,只要代码好(!)Google地图脚本加载到<head>.

另请参见:https://developer.wordpress.org/reference/functions/wp_enqueue_script/