Classic Themes: Enable Fonts and thus global styles #73971

youknowriad · 2025-12-12T14:14:11Z

What?

This PR enables the Fonts page for classic themes. That said, the fonts page relies on Global styles working to be able to work properly:

We need to be able to save global styles
We need global styles to generate CSS properly to be able to use the fonts in posts, pages...

This basically means that by enabling fonts, we're literally enabling all of global styles for classic themes (the UI for global styles remain hidden for the context of this PR).

I tested this briefly using 2019 theme, I installed some fonts, used them in some posts... Things are working decently to be honest. Now, I'm well aware that enabling global styles CSS generation can potentially have some side effects on these themes.

So I'd like some help from folks to test different kind of classic themes to see if this PR impacts frontend rendering in any way. Also check that you can install fonts and use them.

github-actions · 2025-12-12T14:14:54Z

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: youknowriad <[email protected]>
Co-authored-by: SirLouen <[email protected]>
Co-authored-by: jasmussen <[email protected]>
Co-authored-by: matiasbenedetto <[email protected]>
Co-authored-by: t-hamano <[email protected]>
Co-authored-by: mrleemon <[email protected]>
Co-authored-by: Drivingralle <[email protected]>
Co-authored-by: annezazu <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

SirLouen

Test Report

Description

✅ This report validates that the indicated patch works as expected.

Environment

WordPress: 7.0-alpha-61215-src
PHP: 8.2.29
Server: nginx/1.29.3
Database: mysqli (Server: 8.4.7 / Client: mysqlnd 8.2.29)
Browser: Chrome 142.0.0.0
OS: Windows 10/11
Theme: Twenty Seventeen 4.0
MU Plugins: None activated
Plugins:
- Gutenberg 22.3.0-rc.1
- Test Reports 1.2.1

Testing Instructions

Go to Appearance > Fonts
Upload a new font
Create a new post
Add a paragraph, and in Block > Typography select Font
Select the uploaded font

Actual Results

✅ Issue resolved with patch.

Additional Notes

@youknowriad can you do a little overview of what is being introduced apart from adding fonts for classic themes? Like a more comprehensive list of items to be tested. Judging by the code, I feel that more things can be achieved apart from just what I tested.

Supplemental Artifacts

SirLouen · 2025-12-12T14:57:00Z

More Testing

Fonts not selectable in

2010 theme

2011 theme

And 2020 also tested.

youknowriad · 2025-12-12T14:59:38Z

can you do a little overview of what is being introduced apart from adding fonts for classic themes? Like a more comprehensive list of items to be tested. Judging by the code, I feel that more things can be achieved apart from just what I tested.

It's explained in the description. The only visible addition here is "fonts for classic themes" but to be able to do that, we had to lift some conditions to generate CSS out of global styles for classic themes. And my fear is whether the removal of these conditions has any unwanted effect on the frontend of sites using classic themes (with or without custom fonts). I have no way to know 100% outside testing classic themes and ensure the changes don't impact them.

youknowriad · 2025-12-12T15:00:32Z

Are they binded to the theme when you upload them?

Yes, like all global styles changes, you have to go to the "fonts" page and "activate them" again. Making them persist with theme switches is out of scope.

SirLouen · 2025-12-12T15:02:51Z

Are they binded to the theme when you upload them?

Yes, like all global styles changes, you have to go to the "fonts" page and "activate them" again. Making them persist with theme switches is out of scope.

Ok, all good then 👍

SirLouen · 2025-12-12T15:07:55Z

Tested now in

2010✅
2011✅
2012✅
2013✅
2015✅
2016✅
2017✅
2019✅
2020✅
2021✅
Looking good in the front end for all variants.

youknowriad · 2025-12-12T15:09:45Z

lib/compat/wordpress-7.0/global-styles.php

@@ -0,0 +1,144 @@
+<?php
+/**


This whole file is only here to override the Core behavior, but in reality there's no really change here from core behavior outside calling the overridden Gutenberg theme.json functions...

youknowriad · 2025-12-12T15:10:27Z

lib/compat/wordpress-7.0/rest-api.php

+ * @param WP_Theme         $theme    Theme object used to create response.
+ * @return WP_REST_Response Modified response object.
+ */
+function gutenberg_rest_theme_global_styles_link_rel_7_0( $response, $theme ) {


This just makes the global style id available in theme endpoint. I believe @t-hamano opened a trac ticket about this a few days ago as well.

jasmussen · 2025-12-12T15:10:45Z

Nice win!

SirLouen · 2025-12-12T15:59:49Z

@youknowriad after experimenting a bit with lib/compat/wordpress-7.0/global-styles.php I've created a test in #73974 that could be worth checking. I've added this as a PR to this branch.

Apart from this, for the rest all looking good to me. Maybe some collisions could appear with blocks or custom themes, but I could not find anything else.

youknowriad · 2025-12-12T16:03:06Z

To be honest, I don't believe the tests add much value, especially since the main reason for the existing of the code is to override what code does by just calling the gutenberg functions. It's a code that is meant to be removed from Gutenberg (and core) and won't persist in any repo.

github-actions · 2025-12-12T16:13:52Z

Flaky tests detected in 6d5be3a.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/20171563157
📝 Reported issues:

[Flaky Test] should open and edit templates correctly when active_templates experiment is disabled #73743 in /test/e2e/specs/site-editor/template-id-format.spec.js

SirLouen · 2025-12-12T16:19:03Z

To be honest, I don't believe the tests add much value, especially since the main reason for the existing of the code is to override what code does by just calling the gutenberg functions. It's a code that is meant to be removed from Gutenberg (and core) and won't persist in any repo.

Ok, I don't have all the context for the intention of these introdutions
So apart from this, I could not find anything else. Feel free to close the corresponding PR.

youknowriad · 2025-12-12T16:24:35Z

I really appreciate the help with both the automated tests and the testing. Thanks a lot :). I'm going to leave this PR open for a bit more feedback and testing and maybe we can move forward early next week.

SirLouen · 2025-12-13T12:45:42Z

lib/compat/wordpress-7.0/global-styles.php

+	foreach ( $settings['typography']['fontFamilies'] as $font_families ) {
+		foreach ( $font_families as $definition ) {
+			// Skip if "fontFace" is not defined, meaning there are no variations.
+			if ( empty( $definition['fontFace'] ) ) {


Suggested change

if ( empty( $definition['fontFace'] ) ) {

$font_faces = $definition['fontFace'];

if ( empty( $font_faces ) ) {

SirLouen · 2025-12-13T12:47:46Z

lib/compat/wordpress-7.0/global-styles.php

+			if ( empty( $definition['fontFamily'] ) ) {
+				continue;
+			}
+
+			$font_family_name = $definition['fontFamily'];


Suggested change

if ( empty( $definition['fontFamily'] ) ) {

continue;

}

$font_family_name = $definition['fontFamily'];

$font_family_name = $definition['fontFamily'];

if ( empty( $font_family_name ) ) {

continue;

}

SirLouen · 2025-12-13T12:49:23Z

lib/compat/wordpress-7.0/global-styles.php

+
+			// Convert font face properties.
+			$converted_font_faces = array();
+			foreach ( $definition['fontFace'] as $font_face ) {


Suggested change

foreach ( $definition['fontFace'] as $font_face ) {

foreach ( $font_faces as $font_face ) {

SirLouen · 2025-12-13T12:58:46Z

lib/compat/wordpress-7.0/global-styles.php

+			if ( str_contains( $font_family_name, ',' ) ) {
+				$font_family_name = explode( ',', $font_family_name )[0];
+			}
+			$font_family_name = trim( $font_family_name, "\"'" );
+
+			// Skip if no font family is defined.
+			if ( empty( $font_family_name ) ) {
+				continue;
+			}


I don't get this section.
If the $font_family_name happens to be a string with comma separated font names, it will convert it into an array

But after conversion to array, it executes a trim? Maybe you were looking for an array_map('trim', ...)? I'm have not dug too much into the format of the fontFamily, but finally it checks again if it's empty. Is there any chance of having a fontFamily like this , ?

SirLouen · 2025-12-13T15:34:56Z

Additional Testing

I've been playing around with a custom classic theme with a default global font:

Here the playground testing environment:
https://playground.wordpress.net/?blueprint-url=https%3A%2F%2Fgist.githubusercontent.com%2FSirLouen%2F07cd5efa2e9ae0df553c933593f6feff%2Fraw%2F8e184826660caeca70e72b9f3f4973d9b6b310a9%2Fblueprint.json&gutenberg-branch=add%2Fenable-fonts-classic-themes

This is the raw blueprint: https://gist.githubusercontent.com/SirLouen/07cd5efa2e9ae0df553c933593f6feff/raw/8e184826660caeca70e72b9f3f4973d9b6b310a9/blueprint.json

I've added a font to the custom theme.

And then added a custom font to a paragraph of text

But the font is not applying in the_excerpt which is probably expected as it's being removed from all block styles and full fallback to default styles.

✅ But in the the_content its working fine and taking precedence.

Template Code

<!-- wp:paragraph -->
<p>Experimenting without font</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"fontFamily":"limelight"} -->
<p class="has-limelight-font-family">Experimenting with font</p>
<!-- /wp:paragraph -->

Backend:

Frontend with the_excerpt

Frontend with the_content

Classic Themes: Enable Fonts and thus global styles

9c74b0f

youknowriad requested review from jameskoster, jasmussen and t-hamano December 12, 2025 14:14

youknowriad self-assigned this Dec 12, 2025

youknowriad requested a review from spacedmonkey as a code owner December 12, 2025 14:14

youknowriad added [Type] Enhancement A suggestion for improvement. Needs Testing Needs further testing to be confirmed. [Feature] Themes Questions or issues with incorporating or styling blocks in a theme. [Feature] Font Library labels Dec 12, 2025

youknowriad requested review from aaronrobertshaw, andrewserong, ramonjd and tellthemachines December 12, 2025 14:14

Fix PHPCS

646d17e

SirLouen reviewed Dec 12, 2025

View reviewed changes

Update unit test

bce6024

youknowriad commented Dec 12, 2025

View reviewed changes

youknowriad mentioned this pull request Dec 12, 2025

Global Styles: Lift classic block restrictions WordPress/wordpress-develop#10623

Open

Add backport PR

6d5be3a

SirLouen mentioned this pull request Dec 12, 2025

tests: Add unit tests for Gutenberg's Global styles font face functions new feat #73974

Closed

SirLouen suggested changes Dec 13, 2025

View reviewed changes

	if ( empty( $definition['fontFace'] ) ) {
	$font_faces = $definition['fontFace'];
	if ( empty( $font_faces ) ) {

	foreach ( $definition['fontFace'] as $font_face ) {
	foreach ( $font_faces as $font_face ) {

		@@ -0,0 +1,144 @@
		<?php
		/**

Classic Themes: Enable Fonts and thus global styles #73971

Are you sure you want to change the base?

Classic Themes: Enable Fonts and thus global styles #73971

Conversation

youknowriad commented Dec 12, 2025

What?

Uh oh!

github-actions bot commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

SirLouen left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Test Report

Description

Environment

Testing Instructions

Actual Results

Additional Notes

Supplemental Artifacts

Uh oh!

SirLouen commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

More Testing

Uh oh!

youknowriad commented Dec 12, 2025

Uh oh!

youknowriad commented Dec 12, 2025

Uh oh!

SirLouen commented Dec 12, 2025

Uh oh!

SirLouen commented Dec 12, 2025

Uh oh!

youknowriad Dec 12, 2025

Choose a reason for hiding this comment

Uh oh!

youknowriad Dec 12, 2025

Choose a reason for hiding this comment

Uh oh!

jasmussen commented Dec 12, 2025

Uh oh!

SirLouen commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

youknowriad commented Dec 12, 2025

Uh oh!

github-actions bot commented Dec 12, 2025

Uh oh!

SirLouen commented Dec 12, 2025

Uh oh!

youknowriad commented Dec 12, 2025

Uh oh!

SirLouen Dec 13, 2025

Choose a reason for hiding this comment

Uh oh!

SirLouen Dec 13, 2025

Choose a reason for hiding this comment

Uh oh!

SirLouen Dec 13, 2025

Choose a reason for hiding this comment

Uh oh!

SirLouen Dec 13, 2025

Choose a reason for hiding this comment

Uh oh!

SirLouen commented Dec 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Additional Testing

Template Code

Backend:

Frontend with the_excerpt

Frontend with the_content

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

github-actions bot commented Dec 12, 2025 •

edited

Loading

SirLouen left a comment •

edited

Loading

SirLouen commented Dec 12, 2025 •

edited

Loading

SirLouen commented Dec 12, 2025 •

edited

Loading

SirLouen commented Dec 13, 2025 •

edited

Loading