Javascript 如何将css样式表和js文件调用到自定义WordPress主题中

我正在从头开始开发一个自定义WordPress主题，现在我遇到了加载css和js文件的问题。我到处都在搜索，看看如何才能加载这些文件，我是在

functions.php

文件中这样做的：

    <?php 
function catalog(){
    wp_enqueue_style('bootstrap', get_template_directory_uri() . 'css/bootstrap.min.css');
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/bootstrap.min.js', array( 'jquery' ) );
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array( 'jquery' ) );
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/jquery.js', array( 'jquery' ) );
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array( 'jquery' ) );
    wp_register_script( 'custom-script', get_template_directory_uri() . '/js/offcanvas.js', array( 'jquery' ) );
    wp_enqueue_style('style', get_stylesheet_uri());
}
add_action('wp_enqueue_scripts','catalog');
register_nav_menus(array(
    'primary' => __('Primary Menu'),
    'footer' => __('Footer Menu'),
));
?>

但在所有这些之后，我得到了这个结果，这意味着它们没有被加载：

---

试着做这样的事情

在模板中添加css文件，如下所示

<link rel="stylesheet" href="<?php bloginfo('template_directory');?>/css/bootstrap.min.css">

---

问题您正在注册脚本，但未排队

解决方案：
如果你要注册，那么你必须排队。
wp_enqueue_style（）-用于css排队
wp_enqueue_script（）-用于JS enqueue

更新代码

 <?php 
function catalog(){
    wp_enqueue_style('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css');
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_enqueue_script( 'custom-script-bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-imgesload', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-jquery', get_template_directory_uri() . '/js/jquery.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-offcanvas', get_template_directory_uri() . '/js/offcanvas.js', array( 'jquery' ) );
}
add_action('wp_enqueue_scripts','catalog');
register_nav_menus(array(
    'primary' => __('Primary Menu'),
    'footer' => __('Footer Menu'),
));
?>



建议

对于css和js，如jquery、bootstrap等，总是更喜欢CDN。如果我错了，请纠正我，因为我在WordPress主题中工作过，你不想使用wp\u register\u脚本然后运行wp\u enqueue\u脚本吗？同样，这只是我的想法，我可能完全错了。你也应该使用不同的名称，而不是在所有
wp\u enqueue\u script（）中使用相同的
custom script
调用。是的，为什么它不更可取？否则，只有最后一个具有该名称的javascript文件将被排队请再次检查。不要删除该style.css。这不是主题插件。
 <?php 
function catalog(){
    wp_enqueue_style('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css');
    wp_enqueue_style('style', get_stylesheet_uri());
    wp_enqueue_script( 'custom-script-bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-imgesload', get_template_directory_uri() . '/js/imagesloaded.pkgd.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-jquery', get_template_directory_uri() . '/js/jquery.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-masonry', get_template_directory_uri() . '/js/masonry.pkgd.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'custom-script-offcanvas', get_template_directory_uri() . '/js/offcanvas.js', array( 'jquery' ) );
}
add_action('wp_enqueue_scripts','catalog');
register_nav_menus(array(
    'primary' => __('Primary Menu'),
    'footer' => __('Footer Menu'),
));
?>