wordpress functions.php没有加载javascript文件

Question

我试图使用functions.php包含主题的所有css和JS文件

以下是我到目前为止所做的事情

 <?php

    function blogroom() {

        wp_enqueue_style('bootstrap',  get_stylesheet_directory_uri() . '/assets/lib/bootstrap/dist/css/bootstrap.min.css');
        wp_enqueue_style('loaders',  get_stylesheet_directory_uri() . '/assets/lib/loaders.css/loaders.min.css');
        wp_enqueue_style('iconsmind',  get_stylesheet_directory_uri() . '/assets/lib/iconsmind/iconsmind.css');
        wp_enqueue_style('hamburgers',  get_stylesheet_directory_uri() . '/assets/lib/hamburgers/dist/hamburgers.min.css');
        wp_enqueue_style('font-awesome-css',  get_stylesheet_directory_uri() . '/assets/lib/font-awesome/css/font-awesome.min.css');
        wp_enqueue_style('theme-style',  get_stylesheet_directory_uri() . '/assets/css/style.css');
        wp_enqueue_style('theme-style',  get_stylesheet_directory_uri() . '/assets/css/custom.css');
        wp_register_script( 'bootstrap-js', get_template_directory_uri() . '/assets/lib/bootstrap/dist/js/bootstrap.min.js');
        wp_register_script( 'imageloaded', get_template_directory_uri() . '/assets/lib/imagesloaded/imagesloaded.pkgd.min.js', array( 'bootstrap-js' ) );
        wp_register_script( 'tweenmax', get_template_directory_uri() . '/assets/lib/gsap/src/minified/TweenMax.min.js', array('imageloaded') );
        wp_register_script( 'scroll-to-plugin', get_template_directory_uri() . '/assets/lib/gsap/src/minified/plugins/ScrollToPlugin.min.js', array('tweenmax') );
        wp_register_script( 'customToEase', get_template_directory_uri() . '/assets/lib/CustomEase.min.js', array('scroll-to-plugin') );
        wp_register_script( 'configJs', get_template_directory_uri() . '/assets/js/config.js', array('customToEase') );
        wp_register_script( 'zanimation', get_template_directory_uri() . '/assets/js/zanimation.js', array('configJs') );
        wp_register_script( 'corejs', get_template_directory_uri() . '/assets/js/core.js', array('zanimation') );
        wp_register_script( 'mainjs', get_template_directory_uri() . '/assets/js/main.js', array('corejs') );
        wp_enqueue_script( 'mainjs' );    
     }

    add_action( 'wp_enqueue_scripts', 'blogroom' );


?>

在这里，这只加载我的CSS文件而不是我的js文件。没有加载单个javascript文件。

有人可以帮忙吗？

Answer 1

您只是在不加入脚本的情况下注册脚本。

为每个脚本执行与main.js相同的操作，这意味着对每个已注册的脚本进行排队

wp_enqueue_script( 'your registered script name' );

还要确保在主题标题和页脚中都有wp_head（）和wp_footer（）。

Answer 2

我想这可能是由于对wp_register_script和wp_enqueue_script的误解。

wp_register_script只告诉WP在给定位置有一个脚本，并给它一个“句柄”用于其他目的。 wp_enqueue_scripts告诉WP使用该脚本。而且，有两种格式 - “长”格式就像wp_register_script，所以你可以在一个命令中告诉WP脚本在哪里，并加载它。

下面的代码将起作用 - 我已将您的wp_register_script调用更改为wp_enqueue_script：

function blogroom() {
    wp_enqueue_style('bootstrap',  get_stylesheet_directory_uri() . '/assets/lib/bootstrap/dist/css/bootstrap.min.css');
    wp_enqueue_style('loaders',  get_stylesheet_directory_uri() . '/assets/lib/loaders.css/loaders.min.css');
    wp_enqueue_style('iconsmind',  get_stylesheet_directory_uri() . '/assets/lib/iconsmind/iconsmind.css');
    wp_enqueue_style('hamburgers',  get_stylesheet_directory_uri() . '/assets/lib/hamburgers/dist/hamburgers.min.css');
    wp_enqueue_style('font-awesome-css',  get_stylesheet_directory_uri() . '/assets/lib/font-awesome/css/font-awesome.min.css');
    wp_enqueue_style('theme-style',  get_stylesheet_directory_uri() . '/assets/css/style.css');
    wp_enqueue_style('theme-style',  get_stylesheet_directory_uri() . '/assets/css/custom.css');
    wp_enqueue_script( 'bootstrap-js', get_template_directory_uri() . '/assets/lib/bootstrap/dist/js/bootstrap.min.js');
    wp_enqueue_script( 'imageloaded', get_template_directory_uri() . '/assets/lib/imagesloaded/imagesloaded.pkgd.min.js', array( 'bootstrap-js' ) );
    wp_enqueue_script( 'tweenmax', get_template_directory_uri() . '/assets/lib/gsap/src/minified/TweenMax.min.js', array('imageloaded') );
    wp_enqueue_script( 'scroll-to-plugin', get_template_directory_uri() . '/assets/lib/gsap/src/minified/plugins/ScrollToPlugin.min.js', array('tweenmax') );
    wp_enqueue_script( 'customToEase', get_template_directory_uri() . '/assets/lib/CustomEase.min.js', array('scroll-to-plugin') );
    wp_enqueue_script( 'configJs', get_template_directory_uri() . '/assets/js/config.js', array('customToEase') );
    wp_enqueue_script( 'zanimation', get_template_directory_uri() . '/assets/js/zanimation.js', array('configJs') );
    wp_enqueue_script( 'corejs', get_template_directory_uri() . '/assets/js/core.js', array('zanimation') );
    wp_enqueue_script( 'mainjs', get_template_directory_uri() . '/assets/js/main.js', array('corejs') );  
 }

add_action( 'wp_enqueue_scripts', 'blogroom' );

通常，您只会在几种情况下使用wp_register_script - 这是两个常见的情况： 1.你想使用localize_script来wp_localize_script（这允许你输出你的PHP中的javascript变量，这些变量被认为与注册脚本“相关”） 2.您想要注册脚本，因为您可能会或可能不会在以后输出脚本（这在编写短代码时特别有用，您可以注册脚本，如果呈现短代码则设置“标志”，并且页脚可以输出仅当设置了标志时才使用脚本）。这个方法可以在这篇文章中看到：How to load JavaScript like a WordPress Master