WordPress用template_include时自定义模板CSS/JS不加载head为空

两个独立问题共同导致了你遇到的故障：

1. is_page_template() 函数的作用是判断当前是否为后台给页面（page类型文章）手动分配的模板，你通过template_include钩子动态加载的自定义模板不属于这个范畴，因此判断条件永远不成立，对应分支内的代码完全不会执行。
2. 页面<head>为空、静态资源加载不全的核心原因是：你的自定义模板文件/includes/checklist_edit.php没有调用WordPress核心的wp_head()函数。WordPress所有通过wp_enqueue_script/wp_enqueue_style注册的头部资源、核心头部输出（meta标签、站点接口、工具栏资源等），都依赖wp_head()钩子触发输出；底部的脚本则依赖wp_footer()钩子，缺了这两个函数就会出现head为空、资源加载缺失的问题。

1. 替换错误的模板判断逻辑 #

直接用你已经定义的query_var做页面判断，不要用is_page_template()，修改后的入队代码如下：

function uxwithmarwan_files() {
  // 全局通用资源，全站点加载
  wp_enqueue_script('main-university-js', get_theme_file_uri('/build/index.js'), array('jquery'), '1.0', true);
  wp_enqueue_style('custom-google-fonts', '//fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700');
  wp_enqueue_style('university_main_styles', get_theme_file_uri('/build/style-index.css'));
  wp_enqueue_script('font-awesome', 'https://kit.fontawesome.com/5d2df7d4f7.js');

  // 自定义checklist页面判断，直接读取query_var即可
  $is_checklist_page = get_query_var( 'checklist_slug' ) || get_query_var( 'checklist_action' );
  if ( $is_checklist_page ) {
    // 此处仅需放置checklist页面专属的、不需要全局加载的资源即可
    // 原代码中判断分支内重复入队了和全局完全一致的资源，属于冗余代码，WordPress不会重复加载相同句柄的资源，无需重复编写
  }
}
add_action('wp_enqueue_scripts', 'uxwithmarwan_files');

提示：如果get_query_var拿不到对应值，先确认你已经通过query_vars钩子注册了这两个自定义查询参数，注册参考代码：

add_filter( 'query_vars', function( $vars ) {
  array_push($vars, 'checklist_slug', 'checklist_action');
  return $vars;
} );

2. 修复自定义模板的核心钩子缺失问题 #

打开/includes/checklist_edit.php文件，按照WordPress模板规范补全核心钩子调用：

• 如果你用主题标准的头尾结构，直接在内容区前后调用get_header()和get_footer()即可，这两个函数会自动触发wp_head()和wp_footer()：

<?php get_header(); ?>
<!-- 以下是checklist编辑页的自定义业务代码 -->
<div class="checklist-edit-wrap">
  页面业务内容
</div>
<?php get_footer(); ?>

• 如果你是自定义写的HTML结构，没有用主题自带的头尾，必须手动在</head>标签前加上<?php wp_head(); ?>，在</body>标签前加上<?php wp_footer(); ?>，否则所有挂载到这两个钩子的资源和功能都不会输出。

内容的提问来源于stack exchange，提问作者Marwan Ahmed