
前言
刚把 WordPress 更新到 7.0,打开编辑器发现字体变成了屏幕上比较丑的衬线字体,如上图(封面图)。如果是英文显示可能还好,但在屏幕上用衬线字体显示中文是真的难看。本文会教你如何通过设置自定义额外 CSS 来将编辑器还原成老版本的无衬线字体。
目录
原因定位
不想找到原因而只想解决问题的,可以直接翻到下面 解决方案 部分。
打开任意文章的编辑界面,按 F12 打开浏览器开发者控制台,点击右上角的选择按钮,再将鼠标移到 WordPress 编辑器界面的边缘(箭头尖端位置)然后点左键,接着在开发者控制台中间的 CSS 样式窗口中,找到 html :where(.editor-styles-wrapper) 这个选择器,如图:

可以看到在 html :where(.editor-styles-wrapper) 这个选择器中,有 font-family: serif; 这个样式,这就是罪魁祸首,我们可以将 serif 改为 sans-serif 即可换成无衬线字体。接下来会讲解如何通过自定义 CSS 将这个设定永久保存。
解决方案
方法一:自定义 CSS
在 WordPress 后台左侧工具栏点击 外观>自定义,在自定义页面中点击额外 CSS,添加以下内容并保存:
html :where(.editor-styles-wrapper){font-family:sans-serif}
然后再次打开文章的编辑器,应该就可以恢复正常了。
方法二:关闭主题样式
在编辑器右上角,点击那三个点的按钮,下翻打开偏好设置,在外观选项卡中,将「使用主题样式」的选项关闭即可。具体是什么原因我也不太懂,可能是主题 theme.json 有问题。
























