WordPress 更新完主题或插件，突然发现页面「裸奔」——文字挤在左边、图片超大、菜单变成竖排一串。这种样式丢失（Broken Layout）通常不是内容没了，而是 CSS 或 JS 没加载上。按下面四步排查，大多数人能在 15 分钟内修好。
第一步：强制刷新浏览器与 CDN 缓存
最冤的情况就是本地缓存捣乱。按 Ctrl + Shift + R 或 Ctrl + F5 强制刷新，同时清掉 CDN/对象存储缓存。如果你用了 Cloudflare，进 Speed → Purge Cache → Purge Everything。
再顺手把 WordPress 缓存插件（WP Rocket、W3 Total Cache、LiteSpeed Cache）的缓存清一清。很多时候问题到此结束。
第二步：检查控制台报错
按 F12 打开浏览器开发者工具，看 Console 面板。常见报错分两类：
- 404：CSS/JS 文件路径变了，可能是 HTTPS 混合内容或固定链接规则失效。
- Mixed Content：HTTPS 页面加载了 HTTP 资源，被浏览器拦截。参考站内 HTTPS 混合内容修复文章处理。
Network 面板里过滤 .css 和 .js，看哪些文件红了一片。记下来，后面好定位。
第三步：排查插件与主题冲突
如果最近更新了某个插件或主题，先怀疑它。最快验证方式：
- 进 WordPress 后台 → 插件 → 批量停用所有插件，刷新前台。
- 样式恢复说明是插件冲突，逐个启用找出元凶。
- 如果插件全停还没好，切换成默认主题（Twenty Twenty-Four）再试。
如果后台也进不去，用 FTP/SFTP 重命名 /wp-content/plugins 文件夹，所有插件会被自动停用，这是救命操作。
第四步：修正资源路径与 .htaccess
如果样式文件 404，可能是固定链接规则坏了。到 WordPress 后台 → 设置 → 固定链接，不用改任何东西，直接点「保存更改」，系统会重写 .htaccess。
如果用的 Nginx，检查伪静态规则：
location / {
try_files $uri $uri/ /index.php?$query_string;
}
改完 reload Nginx：sudo nginx -s reload。
常见报错速查
| 现象 | 最可能原因 | 快速处理 |
|---|---|---|
| 页面纯白或纯文字 | 主题 CSS 未加载 | 切默认主题、检查路径 |
| 布局错乱、图片超大 | CSS 被插件覆盖 | 逐个停用插件定位 |
| 菜单变成竖排 | JS 加载失败 | 检查 jQuery 与控制台报错 |
| 只后台样式异常 | 后台 CSS 缓存或插件 | 清缓存、禁用管理栏插件 |
常见问题
Q：清除缓存后样式好了，但过一会儿又乱，怎么办？
A：大概率是某个自动缓存/优化插件（比如 Autoptimize、WP Rocket）把 CSS 合并错了。把 CSS 优化选项关掉，或把主题 CSS 加入排除列表。
Q：我没更新任何东西，为什么突然样式丢失？
A：检查主机是否自动更新了 PHP 版本、SSL 证书是否过期、或者 CDN 回源失败。这些情况都会让资源加载中断。
Q：子主题会导致样式问题吗？
A：会。如果父主题更新了 CSS 文件路径，子主题的 get_template_directory_uri() 调用可能失效。检查子主题 functions.php 里的资源引用。
你遇到过最诡异的 WordPress 样式问题是什么？欢迎在 fenij.com 留言，我们把案例整理成排错清单。
