Using variable fonts and woff2-format in child theme

I created a child theme with the Create Block Theme generator plugin as recommended. I want use the Libre Franklin font. This is variable font. According to all instructions I could find I should be able to use the following code in my theme.json file:

"fontFamilies": [
	{
"fontFace": [{
"fontFamily": "Libre Franklin",
"fontStyle": "normal",
"fontWeight": "100 900",
"src": [
"file:./assets/fonts/libre-franklin.woff2"
]
},
"fontFace": [{
"fontFamily": "Libre Franklin",
"fontStyle": "italic",
"fontWeight": "100 900",
"src": [
"file:./assets/fonts/libre-franklin.woff2"
]
},
"fontFamily": "Libre Franklin",
"slug": "libre-franklin"
],
}

This doesn’t work for some reason, the font doesn’t load even if the rest of the theme is applied (so any errors in the above code would be copy-paste-errors, not syntax errors). The child theme plugin generator automatically created the font files as separate .ttf-files for each weight and style, which means a 1mb of font files. That works, but a variable woff2-file would mean only some kb of files in total.

Any idea why it won’t work?

  • This topic was modified 18 minutes ago by audunmb.

The page I need help with: [log in to see the link]

 

This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer