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情況下，您只會使用wp_register_script這是兩種常見的情況：
1.你想localize_script使用wp_localize_script （這允許你輸出的JavaScript從PHP變量會被認為是“相關”的注冊腳本）
2.您要注冊腳本，因為以后可能會或可能不會輸出腳本（這在編寫簡碼時特別有用，您可以注冊腳本，如果呈現簡碼，則可以設置“標志”，並且頁腳可以輸出僅在設置了標志的情況下才添加腳本）。 在本文中可以看到此方法： 如何像WordPress Master一樣加載JavaScript