[wp-trac] [WordPress Trac] #55985: [Older Twenty-* Themes] Replace directly loading fonts from Google Fonts with including them in each theme

[WordPress Trac]

#55985: [Older Twenty-* Themes] Replace directly loading fonts from Google Fonts
with including them in each theme
---------------------------+----------------------
 Reporter:  luminuu        |       Owner:  (none)
     Type:  enhancement    |      Status:  new
 Priority:  high           |   Milestone:  6.1
Component:  Bundled Theme  |     Version:
 Severity:  major          |  Resolution:
 Keywords:  has-patch      |     Focuses:  privacy
---------------------------+----------------------

Comment (by sabernhardt):

 No commits have been made to these themes since the 6.0 version bumps, so
 creating new theme versions for this specific change could be good ''when
 they are ready''. [https://make.wordpress.org/themes/2022/07/28/using-
 locally-hosted-google-fonts-in-themes/ Using locally hosted fonts] is
 already recommended, but we need to fix our own themes before we can make
 this a requirement for others.

 Reviewing the patches, I found a few problems plus potential improvements:

 1. URL references need to use `get_template_directory_uri()` instead of
 `get_stylesheet_directory_uri()` to work properly with child themes.
 2. When the theme adds the font stylesheet within the `add_editor_style()`
 array, the block editor prints stylesheet contents into an
 [https://core.trac.wordpress.org/browser/trunk/src/wp-admin/edit-form-
 blocks.php?rev=53404#L298 inline script]. This makes the editor look for
 the relative-URL font files within the `wp-admin` directory (`404` errors)
 before correctly finding them in the theme directory from the enqueued
 stylesheet. We may need to create a function like `twentytwelve_mce_css()`
 in the other five themes.
 3. As noted earlier, the empty `local('')` proposed for Twenty Seventeen
 has a reported problem, yet I think `local('Libre Franklin')` and
 `local('Open Sans')` could be worth including (with any
 [https://developer.mozilla.org/en-US/docs/Web/CSS/@font-
 face#specifying_local_font_alternatives name variations]). I tried it with
 the [https://github.com/sabernhardt/wordpress-develop/pull/12/files#diff-
 5ad208b6888b79585c72760ce18e6d6d29b078b069c8c8897a7e34836644c9c2 Open Sans
 stylesheet] in Twenty Twelve.
 4. Creating an additional function for the fonts URL seems unnecessarily
 complex. See the [https://github.com/sabernhardt/wordpress-
 develop/pull/13/files#diff-
 9cc277bc6c29b71bfe940e8fc6861c3b04cc67aef1cea938c17f88fdeccb43c7R246
 Twenty Thirteen example] for a simpler possibility with multiple fonts.
 5. Several license files mention the TrueType format (TTF), though these
 stylesheets have WOFF2 and WOFF.
 6. The font URLs could use the theme version's date instead of `null` when
 enqueued.
 7. Font files might not be updated frequently in these themes, but could
 adding a query string like `?ver=21` be better than `-v21-` in the
 filename?
 8. Would removing the resource hint filter from each theme and deprecating
 the related functions be better than changing the functions?
 9. I would like to consider adding a `function_exists` check, similar to
 the ones wrapped around `twentyfifteen_fonts_url` and
 `twentysixteen_fonts_url`, in the other themes.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/55985#comment:37>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform