WordPress自定义插件中引入的Bootstrap样式无法正常生效

按以下优先级逐一排查即可解决：

• 校验文件路径准确性
  你当前代码的路径写法逻辑没有问题，但90%的同类问题都是实际文件路径和代码不匹配导致的：
  1. 确认服务器上的文件层级完全符合：wp-content/plugins/turnover-calculator/turnovercalculator.php、wp-content/plugins/turnover-calculator/bootstrap/css/bootstrap.css，常见错误是上传bootstrap文件夹时多嵌套了一层目录、文件名大小写不匹配（Linux服务器下Bootstrap和bootstrap是两个不同文件夹）、错把压缩版文件名bootstrap.min.css写成了bootstrap.css。
  2. 临时在入队函数里加一行输出：echo plugins_url('/bootstrap/css/bootstrap.css', __FILE__);exit;，访问前台复制输出的路径直接在浏览器打开，如果能正常显示CSS源码说明路径正确，报404就对照修正路径。
• 修正入队钩子逻辑
  不需要把样式注册挂在init钩子，该钩子执行时机过早，部分场景下会导致注册的样式句柄失效，同时默认句柄bootstrap很容易和主题、其他插件加载的Bootstrap重名，被WordPress的去重逻辑跳过加载。直接把注册、入队逻辑统一挂在wp_enqueue_scripts钩子上，给句柄加自定义前缀即可。
• 确认加载状态
  清空浏览器缓存、所有WordPress缓存插件的缓存后访问前台，按F12打开开发者工具：
  1. 切到Network面板筛选CSS类型，看是否存在bootstrap.css的请求，状态码是否为200：
     • 无对应请求：检查插件是否已在后台启用、代码是否存在语法错误、有没有其他代码通过wp_dequeue_style移除了该样式
     • 请求返回403/404：对应修正文件权限或路径
     • 请求返回200但内容不是CSS代码：检查服务器伪静态规则是否拦截了静态资源请求
  2. 切到Elements面板选中你加了btn类的元素，看右侧样式栏是否存在.btn相关规则，如果规则存在但被划掉，说明是被主题/其他插件的更高优先级样式覆盖了。
• 注意加载场景区分
  如果你是在WordPress后台页面测试样式，wp_enqueue_scripts钩子不会在后台触发，需要换成admin_enqueue_scripts钩子才能正常加载。

修正后的可直接使用的代码如下，替换原有代码即可：

add_action('wp_enqueue_scripts', 'tc_enqueue_assets');
function tc_enqueue_assets(){
    // 句柄加tc前缀避免重名，最后一个参数是版本号，方便更新时刷新缓存
    wp_register_style( 'tc-bootstrap', plugins_url('/bootstrap/css/bootstrap.css', __FILE__), array(), '1.0.0' );
    wp_enqueue_style( 'tc-bootstrap' );
}

如果你实际使用的是压缩版Bootstrap文件，把代码中bootstrap.css替换为bootstrap.min.css即可。

内容的提问来源于stack exchange，提问作者jhayvon brutal