javascript - 在 WordPress 子主题中加载脚本时出现问题

Question

我正在尝试开发我的第一个 WordPress 主题，但在我的子主题的 functions.php 文件中加载几个 javascript 文件时遇到问题。我肯定遗漏了一些东西，因为我的脚本没有运行，但我相当肯定我的语法是正确的。

这是我添加到子主题的functions.php 文件中的代码。它加载一个 javascript 动画库，然后加载我的自定义脚本，其中都不依赖于 jQuery。

add_action('wp_enqueue_scripts', 'custom_theme_scripts');

function custom_theme_scripts() {
    wp_register_script('GSAP','http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenLite.min.js', true);
    wp_register_script('Animations', get_stylesheet_directory_uri() . '/animation.js', true);

    wp_enqueue_script('GSAP');
    wp_enqueue_script('Animations');
}

这是我的自定义脚本，目标是页面上 id 为“logo”的 .svg 元素

window.onload = function() {

    var logo = document.getElementById("logo");
    TweenLite.to(logo, 1.5, { width:5000 });

};

Answer 1

我将您的代码复制并粘贴到我的一个子主题中，包括您的 JavaScript 代码，并且所有运行都没有问题。

当您为自己的 WordPress 主题创建子主题时，请确保进行了正确的设置:

1. style.css:检查它是否包含正确的 header ，其中基本上包括带有父主题目录名称的倾斜线。
2. functions.php:当您包含子主题时，您必须在子主题的functions.php中添加父style.css的注册。换句话说，在激活子主题之前，请确保在注册脚本时包含以下内容:

。

wp_register_style( 'childstyle', get_stylesheet_directory_uri() . '/style.css'  );
wp_enqueue_style( 'childstyle' );

此外，如果一切设置正确，它应该加载您的脚本。检查浏览器中已通过开发工具加载的资源。或者尝试加载任何其他 JavaScript 行来检查脚本是否正在运行。

如果主题设置的其余部分已正确完成，您发布的脚本就可以工作。我无法透露更多信息，希望对您有所帮助