Theme.json – fontFamily fontFace[]

  • Hi there. Let me start by saying i’m in the camp with those who aren’t very excited about Blocks, and theme.json . but, it is what it is.

    i want to create a theme with typography based on the font, Sohne . I guess that’s German. So, the names aren’t common like “bold”, etc. Instead, it has “strong”, and “wide”, or “fat”, half-fat.
    here’s what i have in the themes.json

    "typography": {
			"dropCap": true,
			"fontFamilies": [
				{
					"name": "System",
					"slug": "system",
					"fontFamily": "-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Oxygen-Sans,Ubuntu,Cantarell,\"Helvetica Neue\",sans-serif"
				},
				{
					"name": "Serif",
					"slug": "serif",
					"fontFamily": "\"Times New Roman\",\"New York\",Times,\"Noto Serif\",serif"
				},
				{

					"name": "Sohne",
					"slug": "sohne",
					"fontFamily": "Sohne",
					"fontFace": [{
							"fontFamily": "Sohne",
							"fontWeight": "900",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/SohneBreit-Kraftig.woff"]
						},
						{
							"fontFamily": "Sohne",
							"fontWeight": "800",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/SohneBreit-Halbfett.woff"]
						},
						{
	
							"fontFamily": "Sohne",
							"fontWeight": "400",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/Sohne-Buch.woff"]
						},
						{
	
							"fontFamily": "Sohne",
							"fontWeight": "700",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/Sohne-Kraftig.woff"]
						},
						{
	
							"fontFamily": "Sohne",
							"fontWeight": "600",
							"fontStyle": "normal",
							"fontStretch": "normal",
							"src": [ "file:./assets/fonts/Sohne-Halbfett.woff"]
						}
					]
				},
				{
					"name": "Monospace",
					"slug": "monospace",
					"fontFamily": "Consolas,Menlo,Monaco,\"SF Mono\",\"DejaVu Sans Mono\",\"Roboto Mono\",\"Courier New\",Courier,monospace"
				}
			],

    how do i correct that code so that the “block editor” recognizes the various font faces? per the code above, only the “extra bold” setting in the WordPress editor changes the perceived style. i don’t even know for certain which of the fonts its selecting.

    what do i read to understand how to get WordPress to play well with this font if i wish to create a block theme? i’m familiar with fullsiteediting.com

    thank you!
    ??

    • This topic was modified 1 year, 11 months ago by ajaxStardust.
Viewing 3 replies - 1 through 3 (of 3 total)

  • Sorry to not really answer your question but if you’re in that camp, then don’t use blocks. Use the disable gutenberg plugin and build the site normally.

    Sorry I don’t know the answer otherwise, cause i dont touch blocks.

    Thread Starter ajaxStardust

    (@ajaxstardust)

    Why would you bother me to make that comment? Guy Fieri doesn’t like eggs. What does he do for a living? This is why i don’t participate in these forums.

    Because it’s a real solution, don’t use blocks. You even said you don’t care for them, I thought I would suggest that you disable that system, might be easier to customize and do what you want, the ol’ fashion way.

    And what kind of weirdo doesn’t like eggs?

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Theme.json – fontFamily fontFace[]’ is closed to new replies.