Question

我知道这件事已经有几个主题，但似乎没有一个能解决我的问题。

我想链接一个自定义的WordPress主题，我正在创建几个JavaScript文件。我已经尝试了很多可能的方法，但似乎没有一种方法适合我。

要跳过我已经尝试添加文件的所有方法，请告诉我如何添加文件“prettyPhoto.js”以便在我的自定义主题中工作。

谢谢你，岸堤

Answer 1

正确的方法是使用wp_register_script和wp_enqueue_script。使用这些将指示WordPress在任何相关脚本之后加载脚本。

所以说你的prettyPhoto.js文件位于mytheme/js。在functions.php中添加类似：

的内容

<?php
add_action('wp_enqueue_scripts', 'mytheme_load_scripts');
function mytheme_load_scripts() {
  // this only registers the script with WordPress
  wp_register_script('prettyPhoto', get_stylesheet_directory_uri().'/js/prettyPhoto.js');
  // this actually loads the script in `wp_head`
  wp_enqueue_script('prettyPhoto');
}
?>

如果prettyPhoto.js依赖于jQuery或其他东西，那么请在wp_register_script中指定。执行以下操作将告诉WordPress确保在加载脚本之前加载jQuery。

<?php
wp_register_script('prettyPhoto', get_stylesheet_directory_uri().'/js/prettyPhoto.js', array('jquery'));
?>

请参阅代码中的wp_register_script和wp_enqueue_script了解更多信息。

This article也可能会有所帮助。

Answer 2

我想这对你不起作用，因为你可能忘记放置wp_head()

了

在主题模板中的标记之前（例如header.php，的index.php）

或关于放置wp_footer()

在主题模板中标记之前（例如footer.php，的index.php）。

花一些时间熟悉Theme Development Checklist。

如果没有看到模板并且不知道你已经尝试了什么，很难猜到，但你需要的是wp_enqueue_script函数（在functions.php中）以及wp_head（）和|或wp_footer（）（在模板中）。

确保模板中的wp_head()之前有</head>。
确保模板中的wp_footer()之前有</body>。

将以下代码放入functions.php：

function my_theme_add_javascript() {
    wp_enqueue_script(
        'pretty-photo',
        get_template_directory_uri() . '/js/prettyPhoto.js',
        array('jquery')
    );
}
add_action('wp_enqueue_scripts', 'my_theme_add_javascript');

在wordpress自定义主题中集成javascript文件

2 个答案: