And I do not like the default headers font. What is my best option to change them? I am thinking generally of H1-H6 and but really any other serif font that crops up on this theme.

I think I could:

1) Set up a child theme with a duplicate json where I register some new fonts and try to remember to update the json if the theme ever gets updated. I am not sure this would even help because if I go to the global styles for blocks (by opening any template and then going to the upper right and clicking on the “black and white cookie” icon, and then selecting the header blocks), I do not see a pop up to select added fonts.

2) Set up a child theme with a duplicate json where I change this code:
___________________________________

"typography": {
			"dropCap": false,
			"fontFamilies": [
				{
					"fontFamily": "-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif",
					"name": "System Font",
					"slug": "system-font"
				},
				{
					"fontFamily": "\"Source Serif Pro\", serif",
					"name": "Source Serif Pro",
					"slug": "source-serif-pro"
				}

________________________________________

Keeping the name and slug the same but change the fontFamily to what I want. Again, remebering to update the json if the theme ever updates. (ugh)

3) Brute force CSS where I attached a CSS sheet in the child theme and then adjust each heading and element (H1, H2, or anything else) on a style by style basis. Which precludes the need for global styles but I have no hooks to change those. Alas.

(As a side note, there is no place for Custom CSS anymore, right? I have to either attach a sheet or use a plug-in, is this correct).

So those are the three options I have. I do not like any of them, really.

Help? S.O.S. etc. Thanks!

I was able to add a child style.css file and that recognised my custom CSS. However it almost seems like my theme.json is not being observed. This is my child theme.json:

`{
“version”: 2,
“settings”: {

“typography”: {
“dropCap”: false,
“fontFamilies”: [
{
“fontFamily”:”Roboto,\”Helvetica Neue\”,sans-serif”,
“name”: “System Font”,
“slug”: “system-font”
},
{
“fontFamily”: “\”IBM Plex Sans\”, sans-serif”,
“name”: “IBM Plex Sans”,
“slug”: “ibm-plex-sans”,
“fontFace”: [
{
“fontFamily”: “IBMPlexSans-Light.woff2”,
“fontWeight”: “400”,
“fontStyle”: “normal”,
“fontStretch”: “normal”,
“src”: [ “file:./twentytwentytwo/assets/fonts/ibm-plex/IBMPlexSans-Light.woff2” ]
}
]
}
],
“fontSizes”: [
{
“size”: “1rem”,
“slug”: “small”
},
{
“size”: “1.125rem”,
“slug”: “medium”
},
{
“size”: “1.75rem”,
“slug”: “large”
},
{
“size”: “clamp(1.75rem, 3vw, 2.25rem)”,
“slug”: “x-large”
}
]
},
“layout”: {
“contentSize”: “960px”,
“wideSize”: “1000px”
},
“styles”: {
“blocks”: {
“core/post-title”: {
“typography”: {
“fontFamily”: “var(–wp–preset–font-family–ibm-plex-sans)”,
“fontWeight”: “300”,
“lineHeight”: “var(–wp–custom–typography–line-height–tiny)”,
“fontSize”: “var(–wp–custom–typography–font-size–gigantic)”
}
},
}
}
}
}

I also dream of a more free font control in Twentytwentytwo. Here and now it is very difficult to change the fonts. A thing like that ought to be easy. The ordinary user would probably give up if they are to fight with weird looking json.

As an alternative to a child theme you could create a theme from scratch. Just copy the folder and paste it under another name. Then you can change the style.css informations with the theme name etc.

The upside of such a solution is the freedom from the original theme. Updates won’t overwrite your work. The flipside of the coin is – you don’t get the brand new updates here.

But in theory you should be able to have a separate theme json file inside the childtheme folder.

HOWEVER, a few people mentioned that their child.css files are being ignored. Make sure your child theme folder has been created properly… it’s changed with FSE.

I used a WP supplied plugin called ‘Create Block Theme’ and then modified the result. Works like a charm (except for the theme.json).