WordPress 6.0 add_editor_style无法在Gutenberg编辑器加载style.css

核心配置错误 #

你提供的代码存在调用顺序错误，这是90%同类问题的诱因：WordPress要求必须先注册editor-styles主题支持，再调用add_editor_style()加载样式文件，顺序颠倒时加载逻辑不会触发。
修正后的代码如下：

function lr_theme_features() {
    // 先开启编辑器样式支持
    add_theme_support('editor-styles');
    // 再注册要加载的样式文件
    add_editor_style( 'style.css' );
}
add_action('after_setup_theme', 'lr_theme_features');

其他常见遗漏配置 #

如果调整顺序后仍不生效，逐一排查以下问题：

• 路径匹配错误：add_editor_style()默认读取主题根目录下的文件，如果你的style.css存放在子目录（如/assets/css/），需要填写相对于主题根目录的完整路径，例如add_editor_style( 'assets/css/style.css' )
• 缓存拦截：古腾堡编辑器对静态资源有强缓存策略，修改配置后先清空浏览器缓存、站点对象缓存，再通过硬刷新（Ctrl+F5 / Cmd+Shift+R）重载编辑器页面
• 样式隔离兼容问题：WordPress 6.0+版本默认给编辑器内样式添加.editor-styles-wrapper作用域前缀，如果你的CSS选择器权重不足，会被编辑器默认样式覆盖；可在主题根目录的theme.json中添加如下配置兼容：

{
    "settings": {
        "useRootPaddingAwareAlignments": true
    }
}

• 文件权限异常：确认服务器上的style.css权限为644，权限不足会导致资源请求返回403无法加载

调试流程 #

按以下步骤定位具体问题：

1. 打开古腾堡编辑器页面，按F12唤起浏览器开发者工具，切换到「网络」面板，筛选CSS类资源，搜索style.css查看请求状态：
   • 返回404：路径配置错误，核对文件实际存放位置和add_editor_style内填写的路径
   • 返回403：文件权限不足或服务器安全规则拦截，调整文件权限，临时禁用安全类插件排查
   • 返回200但样式不生效：切换到「元素」面板选中自定义区块，检查样式是否被更高权重规则覆盖，或因作用域前缀导致选择器不匹配
2. 临时切换到WordPress官方默认主题（如Twenty Twenty-Four），测试默认主题编辑器样式是否正常加载，排除核心文件损坏、插件冲突问题：如果默认主题也无法加载样式，逐次禁用插件排查冲突，重点排查缓存插件、编辑器增强类插件
3. 全局搜索主题代码，确认没有后续调用remove_theme_support('editor-styles')提前关闭了编辑器样式支持

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