WordPress 6.5 新功能：字体库 详解

字体库 在 WordPress 6.5 中引入，允许用户直接在编辑器中管理字体。它附带了一组 API，允许开发人员控制、调整和禁用其行为。
- ^- O7 v9 {; m$ l  u
字体集

字体集是用户可以通过编辑器安装的字体系列定义的列表。字体系列定义是theme.json格式中的一个fontFamily项。默认情况下，WordPress 6.5 允许用户选择加入 Google 字体集合列表。为了让网站保持GDPR合规性，安装 Google 字体会将文件下载到 WordPress 服务器。

注册字体集合后，它将出现在编辑器的字体库UI中。从这里，用户可以安装并激活该集合中的字体。

1 D. |# g! O2 Q4 V- B, H/ x
添加字体集

可以使用wp_register_font_collection()函数添加新的字体集合。这可以通过以PHP或JSON格式提供字体系列及其字体列表作为字体集合数组的一部分来完成。

以下是在 PHP 中添加字体集合的示例：

1. $font_families = [
   
2.         array(
   & }# P, W8 y" C/ y. n, j! B+ o
3.                 'font_family_settings' => (
   0 K1 L) f, C, b, q" O
4.                         array (
   
5.                                 'fontFamily' => 'Open Sans, sans-serif',
   
6.                                 'slug'       => 'open-sans',
   & n1 _7 y- A0 U, w6 x) d
7.                                 'name'       => 'Open Sans',
   ! l" k' V, v" |: Z& J
8.                                 'fontFace'   => (
   ) r) i+ |5 T: Y% ]& C; _9 m% T
9.                                         array (
   
10.                                                         'fontFamily' => 'Open Sans',
    
11.                                                         'fontStyle'  => 'normal',
    7 Y6 ~& v0 W$ \2 z. k* Q: k" B: r
12.                                                         'fontWeight' => '300',
    5 K9 Y& L5 j" ~; {; N
13.                                                         'src'        => 'https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4iY1M2xLER.woff2'
    . p- ]  ^. @/ s6 [4 }" {
14.                                         ),
    
15.                                         array (
      H2 O2 u4 s* u0 O- @3 _" \
16.                                                         'fontFamily' => 'Open Sans',
    $ z* v( t: f: n0 m; ^0 z
17.                                                         'fontStyle'  => 'italic',
    : i& B, F! @+ j% c( K
18.                                                         'fontWeight' => '400',
    
19.                                                         'src'        => 'https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVIUwaERZjA.woff2'
    % G' F8 T4 T( }- q8 H
20.                                         ),
    . X# u0 f- `/ s% g* T
21.                                 ),
    
22.                         ),
    
23.                 ),
    / `2 V" Y7 O& u
24.                 'categories' => [ 'sans-serif' ],
    
25.         ),
    2 v4 q3 e  p0 F! i3 r* b6 c
26.         array(
    
27.                 'font_family_settings' => (
    
28.                         array (
    
29.                                 'fontFamily' => 'Monoton, system-ui',
    % S" g  x. Y1 j
30.                                 'slug'       => 'monoton',
    
31.                                 'name'       => 'Monoton',
    , Q4 O- ]  X+ f% b1 w: k$ E* d
32.                                 'fontFace'   => (
    
33.                                         array (
    
34.                                                         'fontFamily' => 'Monoton',
    ) ?( Q% G: W) o8 K2 n% V/ o, Y
35.                                                         'fontStyle'  => 'normal',
    * l' j- M4 i: b! ~5 e
36.                                                         'fontWeight' => '400',
    . K9 D% o4 x% a1 b8 W
37.                                                         'src'        => 'https://fonts.gstatic.com/s/monoton/v19/5h1aiZUrOngCibe4fkPBQ2S7FU8.woff2',
    9 h( ^$ a3 |6 U9 E
38.                                                         'preview'    => 'https://s.w.org/images/fonts/17.7/previews/monoton/monoton-400-normal.svg'
    3 [& C4 ^* V5 R- S: p& a
39.                                         ),
    
40.                                 ),
    
41.                         )
    
42.                 ),
    0 u- k2 N7 |" v! J5 Y7 D% d" N4 ^
43.                 'categories' => [ 'display' ],
    
44.         ),
    6 \8 l/ s+ e( B. S
45.         array(
      r. O' P8 c% e: O: |- l4 M  F* f1 }
46.                 'font_family_settings' => (
    ' Y/ o* q, Y% S1 u# B
47.                         array (
    2 ~: I) E" S1 |5 `9 a+ O
48.                                 'fontFamily' => 'Arial, Helvetica, Tahoma, Geneva, sans-serif',
    / T3 y( t8 C/ g1 j# x& Y! I
49.                                 'slug'       => 'arial',
    
50.                                 'name'       => 'Arial',
    8 W! V" ]9 Y- k0 A& l; z3 i
51.                         )
    
52.                 ),
    % V1 G. ?& n7 ~4 ?
53.                 'categories' => [ 'sans-serif' ],
    0 e. i  Y) n+ d8 t7 M$ `/ j' t; H- U9 x
54.         ),
    
55. ];
    
56.         
    2 }, m( j2 w/ h: f. M
57. $categories = [
    
58.         array(
    ( X9 s; p8 m6 N0 i% S4 d
59.         'name' => _x( 'Display', 'Font category name' ),
    ! z" F; J* l$ f7 `! {
60.                 'slug' => 'display',
    
61.         ),
    
62.         array(
    1 J5 \5 F0 j" L  Z4 p0 @( g& O8 ~
63.                 'name' => _x( 'Sans Serif', 'Font category name' ),
    
64.                 'slug' => 'sans-serif',
    , w, k5 O; h7 P6 c2 A  P. c
65.         ),
    
66. ];
    ! ~: ?: N- d0 W+ s
67. $config = array (
    
68.         'name'          => _x( 'My font collection', 'Font collection name' ),
    ! U: L1 y5 H  h0 `& L. Q" ~
69.         'description'   => _x(  'A collection of my favorite fonts.', 'Font collection description' ),
    , N8 ~2 f+ [0 \# t" w1 u/ a  b3 F: Y
70.         'font_families' => $font_families,
    3 P! Y" g( E2 ?: G; j8 J: _7 O! \
71.         'categories'    => $categories,
    + V, S# }" t/ i# M! V2 ]1 V
72. );
    - g* j3 ^! E& y8 l' Z+ c: H8 ?
73. wp_register_font_collection ( 'my-font-collection', $config );

复制代码

请注意， Font Collection 数组的name和description字段必须是可翻译的，这可以通过将字符串包装在_x() 函数中来实现。字体系列名称通常不被翻译。有关更多信息和背景讨论，请参阅#60509。

该字段的 JSON 格式font_families可以是本地路径或指向 JSON 文件的远程URL 。

删除字体集

可以使用wp_unregister_font_collection()函数禁用字体集合。这是禁用默认字体集合的示例：

1. add_action( 'init', function() {
   
2.         wp_unregister_font_collection( 'default-font-collection' );
   6 C1 x' E$ P- ?" o
3. } );

复制代码

有关更多信息，请参阅#57980。

8 {' ?5 C9 {/ m$ S0 f安装和激活字体

字体定义基于theme.json 格式进行字体设置。将字体“安装”到网站会将集合中的 theme.json 格式设置保存到数据库中，因此可以为任何主题激活该字体。

当字体被“激活”时，主题的全局样式设置将被更新，以便包含该字体以及主题定义的字体，并且可以在全局样式和单个块的版式设置中使用。

切换到新主题时，需要重新激活已安装的字体，以更新该主题的站点全局样式设置。如果重置主题的全局样式，这将停用所有已安装的字体，但它们将保留在站点上，并且可以根据需要重新激活。

此外，字体库可用于停用主题中包含的字体（如果不需要），以提高网站的加载性能。

自定义字体上传目录

请注意，以下一些详细信息（例如函数名称）可能在 6.5 版本之前发生更改。有关更多信息，请参阅#60751和古腾堡问题#59699。

默认情况下，字体将上传到该wp-content/fonts目录。但是，可以使用 font_dir 过滤器根据需要自定义该位置。对于不支持修改wp-content目录的安装，wp-content/uploads/fonts将用作后备目录。

可以使用 wp_get_font_dir()返回字体上传目录的位置。

下面的示例将字体目录更改为 WordPress “Uploads”目录（默认情况下为wp-content/uploads）：

1. function alter_wp_fonts_dir( $defaults ) {
   
2.         $wp_upload_dir = wp_get_upload_dir();
   , b6 r! i5 t0 x, w9 j2 }
3.         $uploads_basedir = $wp_upload_dir['basedir'];
   
4.         $uploads_baseurl = $wp_upload_dir['baseurl'];
   
5.         $fonts_dir = $uploads_basedir . '/fonts';
   9 _  G& g4 m$ a
6.         // Generate the URL for the fonts directory from the font dir.
   
7.         $fonts_url = str_replace( $uploads_basedir, $uploads_baseurl, $fonts_dir );
   : d7 {' d& C+ B2 d1 M
8.         $defaults['path'] = $fonts_dir;
   % H' q0 k. D9 X) ^& ]
9.         $defaults['url']  = $fonts_url;
   
10.         return $defaults;
    
11. }
    $ T2 `3 [7 h1 r" V5 A: {
12. add_filter( 'font_dir', 'alter_wp_fonts_dir' );

复制代码

修改上传位置时，重要的是要确保所选位置存在并且设置了适当的读/写权限。

与wp-content/uploads目录一样，字体上传目录不会坚持 wp_is_file_mod_allowed/DISALLOW_FILE_MODS 以防止字体上传。

有关更多信息，请参阅#59417和这篇文章。

- q0 c) n; H: Q: ~5 Z% d. [如何禁用字体库

默认情况下可通过编辑器访问字体库。

禁用用户界面

可以使用过滤器来禁用 UI 来自定义编辑器设置：

1. function disable_font_library_ui( $editor_settings ) {
   
2.             $editor_settings['fontLibraryEnabled'] = false;
   
3.             return $editor_settings;
   
4. }
   
5. add_filter( 'block_editor_settings_all', 'disable_font_library_ui' );

复制代码

禁用REST API

该unregister_post_type()函数可用于删除与字体库关联的帖子类型，并通过扩展 REST API：

1. add_action( 'init', function() {
   $ }0 L# e' Z5 P3 h* H* Q0 y
2.             unregister_post_type( 'wp_font_family' );
     D* j3 P' U) s0 h" B& @
3.             unregister_post_type( 'wp_font_face' );
   % z& ^8 R5 m3 Q. U1 }. v
4. } );

复制代码

这允许扩展程序禁用字体库，同时保留用于管理活动主题提供的字体的 UI。

有关更多信息，请参阅#55275和#57818。

新的 REST API

字体库功能引入了三个新的 REST API 端点：

• wp/v2/font-collections – 字体系列预定义列表（即“集合”）的端点。
• wp/v2/font-families – 父字体系列的端点，通常（但并非总是）包含一种或多种字体（即单个字体）。
• wp/v2/font-families/<id>/font-faces – 系列中各个字体的端点。
  * c8 k& g' Z* C

有关每个新端点的详细文档，请参阅REST API 手册和#57616。

5 p8 ^1 M* U4 I  e4 ^& a