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

Integrating javascript files in wordpress custom theme

本文关键字：集成 javascript 文件 wordpress 自定义      更新时间：2024-01-29

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

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

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

谢谢，Andi

正确的方法是使用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_enque_script。

这篇文章可能也会有所帮助。

我想这对你不起作用，因为你可能忘记了放置wp_head（）

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

或关于放置wp_footer（）

在主题模板（例如footer.php，index.php）.

花点时间，让自己熟悉主题发展检查表。

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

  1. 确保模板中</head>之前有wp_head()
  2. 确保模板中</body>之前有wp_footer()

  3. 在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');
相关文章：