Did your editor font go default serif on WordPress 7.0?

Mine did. Like this:

Text asking if the editor font changed to default serif in WordPress 7.0
so meta.

I guess WordPress 7.0 assumes you are using a theme.json file these days. I’m not doing that yet on any of the sites I work on. If you want to embrace that future, you could add a theme.json file to the root of your theme, and put some typography basics only in there:

{
  "$schema": "https://schemas.wp.org/trunk/theme.json",
  "version": 2,
  "settings": {
    "appearanceTools": true,
    "layout": {
      "contentSize": "720px"
    },
    "typography": {
      "fontFamilies": [
        {
          "fontFamily": "system-ui, sans-serif",
          "name": "System Font",
          "slug": "system-font"
        }
      ]
    }
  },
  "styles": {
    "typography": {
      "fontFamily": "var(--wp--preset--font-family--system-font)",
      "lineHeight": "1.75"
    }
  }
}
Code language: JSON / JSON with Comments (json)

That will be much nicer than no styles at all.

Or if you don’t want to mess with that you can go to the upper-right three-dot menu (“Option”), choose Preferences then go to the Appearance tab and make sure Use theme styles is unchecked.

Settings interface showing 'Appearance' options with toggles for 'Top toolbar', 'Distraction free', 'Spotlight mode', and 'Use theme styles' marked with an arrow.

I think it’s sorta neat that you could use the same typography setup for both the front-end and back of your site this way, and if you use theme.json for the front, might as well use it for the back. But I also personally don’t mind if the back-end is entirely default styles. It’s a reminder that you’re in a CMS, and content is data, not WYSIWYG.

Leave a Reply

Your email address will not be published. Required fields are marked *