fontFace in theme.json not working (can’t get bold or italic to work)

I’m building a block theme to work with Gutenberg full site editing and there are two fonts I want to load from my assets folder. The tutorials I found for accomplishing this in the theme.json file seemed simple enough. But I can’t get the bold or italicized font faces to work. they only display properly when I remove the “fontFace” setting from my theme.json. Which has me thinking that the font’s aren’t being loaded from the file at all and instead just display because I already have these fonts on my computer.

The fonts do display as options in my site editor so they’re at least being registered for use on the site.

I’ve tried using both woff2 & ttf fonts. And yes the path to my font files is correct. The theme.json is right inside my theme folder and the fonts are in /assets/fonts/[font name]/font-file.woff2

        "typography": {
            "fontFamilies": [
                {
                    "fontFamily": "\"Raleway\", sans-serif",
                    "slug": "raleway",
                    "name": "Raleway",
                    "fontFace": [
						{
							"fontFamily": "Raleway",
							"fontWeight": "400",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/raleway/Raleway-Medium.ttf" ]
						},
						{
							"fontFamily": "Raleway",
							"fontWeight": "400",
							"fontStyle": "italic",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/raleway/Raleway-Italic.ttf" ]
						}
						,
						{
							"fontFamily": "Raleway",
							"fontWeight": "700",
							"fontStyle": "bold",
							"fontStretch": "normal",
							"src": [ "/assets/fonts/raleway/Raleway-Bold.ttf" ]
						}
					]
                },
                {
                    "fontFamily":  "\"Didot\", serif",
                    "slug": "didot",
                    "name": "Didot",
                    "fontFace": [
						{
							"fontFamily": "Didot",
							"fontWeight": "400",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/didot/Didot-Regular.woff2" ]
						},
						{
							"fontFamily": "Didot",
							"fontWeight": "500",
							"fontStyle": "italic",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/didot/Didot-Italic.woff2" ]
						}
						,
						{
							"fontFamily": "Didot",
							"fontWeight": "700",
							"fontStyle": "bold",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/didot/Didot-Bold.woff2" ]
						}
					]
                }
            ]
        },

• This topic was modified 2 years, 6 months ago by Shelaine Roustio.