引入CSS和JavaScript - 主题开发手册

创建主题时，可能需要创建其他样式表或JavaScript文件。然而，记住WordPress网站不仅会激活你的主题，还会使用许多不同的插件。为了使一切都协调工作，主题和插件必须使用标准的WordPress方法加载脚本和样式表。这将确保站点保持高效，并且不存在不兼容问题。

向WordPress添加脚本和样式是一个相当简单的过程。本质上，您将创建一个将所有脚本和样式排队的函数。当将脚本或样式表排队时，WordPress会创建一个句柄和路径来查找文件及其可能具有的任何依赖项（如jQuery），然后使用一个钩子来插入脚本和样式表。

列队脚本和样式

向你的主题添加脚本和样式的正确方法是在 functions.php 文件中列队。style.css文件在所有主题中都是必需的，但可能需要添加其他文件来扩展主题的功能。

提示：WordPress包含大量JavaScript文件作为软件包的一部分，包括jQuery等常用库。在添加自己的JavaScript之前，请检查是否可以使用包含的库。

基本就是：

使用wp_enqueue_script()或wp_enqueue_style()将脚本或样式加入列队。

样式表

你的CSS样式表是用来定制主题的表现形式的，样式表也是存储你的主题信息的文件。由于这个原因，style.css文件在每个主题中都是必需的。

你应该使用wp_enqueue_style来加载样式表，而不是在你的header.php文件中加载它。为了加载你的主样式表，你可以在 functions.php 中进行列队。

style.css加入列队

wp_enqueue_style( 'style', get_stylesheet_uri() );

这将寻找一个名为 "style "的样式表并加载它。

将样式列队的基本函数是：

wp_enqueue_style( $handle, $src, $deps, $ver, $media );

你可以使用以下参数：

$handle 是简单的样式表的名称
$src 是它所在的位置，其余的参数是可选的
$deps 是指这个样式表是否依赖于另一个样式表。如果这个被设置，这个样式表将不会被加载，除非它的依赖样式表先被加载
$ver 设置版本号
$media 可以指定加载该样式表的媒体类型，如 ‘all’, ‘screen’, ‘print’ 或 ‘handheld’

因此，如果你想在主题根目录下名为 "CSS "的文件夹中加载一个名为 "slider.css "的样式表，你可以使用：

wp_enqueue_style( 'slider', get_template_directory_uri() . '/css/slider.css',false,'1.1','all');

脚本

一个主题所需要的任何额外的JavaScript文件应该使用wp_enqueue_script加载。这可以确保正确的加载和缓存，并允许使用条件标签来针对特定的页面。这些是可选的。

wp_enqueue_script 的语法与 wp_enqueue_style类似

列队你的脚本：

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer);

$handle 脚本名称
$src 定义了脚本的位置
$deps 是一个数组，可以处理你的新脚本所依赖的任何脚本，例如jQuery。
$ver 让你列出一个版本号
$in_footer 是一个布尔参数（true/false），允许你把你的脚本放在HTML文档的页脚，而不是页头，这样就不会延迟DOM树的加载。

你的列队函数大概看起来像这样：

wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);

评论回复脚本

WordPress的评论有相当多的功能是开箱即用的，包括嵌套评论和增强的评论表单。为了使评论能够正常工作，它们需要一些JavaScript。然而，由于有一些选项需要在这个JavaScript中定义，评论回复脚本应该被添加到每个使用评论的经典主题中。

在区块主题中，当你放置一个评论块时，脚本就会被包含在内。你不需要手动添加它。

在经典主题中引入评论回复的正确方法是使用条件标签来检查是否存在某些条件，这样就不会不必要地加载脚本。例如，你可以使用is_singular只在单页面上加载脚本，并检查确保 "启用嵌套评论"被用户选中。因此，你可以设置一个类似的函数。

if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
    wp_enqueue_script( 'comment-reply' );
}

如果用户开启了评论且启用嵌套评论，当我们在一个文章页面上，那么评论回复脚本将被加载。否则，它就不会被加载。

整合列队函数

最好是把所有列队的脚本和样式合并到一个函数中，然后用wp_enqueue_scripts动作钩子调用它们。这个函数和动作应该位于初始设置下方的某个位置来执行。

function add_theme_scripts() {
  wp_enqueue_style( 'style', get_stylesheet_uri() );
 
  wp_enqueue_style( 'slider', get_template_directory_uri() . '/css/slider.css', array(), '1.1', 'all');
 
  wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);
 
    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
      wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'add_theme_scripts' );

WordPress包含和注册的默认脚本

在默认情况下，WordPress包括许多网站开发人员常用的脚本，以及WordPress本身使用的脚本。其中一些被列在这个参考页上：

该列表远非完整。你可以在wp-includes/script-loader.php中找到完整的包含文件列表。