字体库 在 WordPress 6.5 中引入,允许用户直接在编辑器中管理字体。它附带了一组 API,允许开发人员控制、调整和禁用其行为。! T, h& P3 V- e/ R% w; ~ w
1 ^+ c2 a! L( H" z9 @字体集字体集是用户可以通过编辑器安装的字体系列定义的列表。字体系列定义是theme.json格式中的一个fontFamily项。默认情况下,WordPress 6.5 允许用户选择加入 Google 字体集合列表。为了让网站保持GDPR合规性,安装 Google 字体会将文件下载到 WordPress 服务器。 注册字体集合后,它将出现在编辑器的字体库UI中。从这里,用户可以安装并激活该集合中的字体。
2 H$ W) W" s# G: E" G! K( J* Z k7 a7 o) t
) w, L5 M0 s2 P, K6 h
添加字体集可以使用wp_register_font_collection()函数添加新的字体集合。这可以通过以PHP或JSON格式提供字体系列及其字体列表作为字体集合数组的一部分来完成。 以下是在 PHP 中添加字体集合的示例: - $font_families = [
( w7 v1 e4 u/ e" b - array(
& [% w \+ e; l - 'font_family_settings' => (
) A# ?' L9 E' Z - array (: q0 `! \1 R. h
- 'fontFamily' => 'Open Sans, sans-serif',4 I6 y, ^ G+ K) \8 t
- 'slug' => 'open-sans',
5 _9 H( A' X/ c" j& `3 Z8 |7 H/ ~ - 'name' => 'Open Sans', M" j* y5 d' f. |9 a% W( {/ ?; h
- 'fontFace' => (
1 G1 D8 p, f, L - array (0 S& M0 N7 Y$ \1 ]7 f; l
- 'fontFamily' => 'Open Sans'," S2 ~) k. t9 K: w2 ~: J. G
- 'fontStyle' => 'normal',
# I, y7 R2 Z* S5 q* Y7 l5 M" X - 'fontWeight' => '300',1 J0 L/ D& d( `. e$ U& I
- 'src' => 'https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4iY1M2xLER.woff2'
' f0 g0 d( U3 O" V: O; N6 {$ z" Y4 ~ - ),
; N; L2 j9 `7 k; r: G( I3 l6 \$ ^ - array (
1 r* z2 [" n- d* ?- c$ v - 'fontFamily' => 'Open Sans',
$ X, }: c' A. ?' p- p. k; F - 'fontStyle' => 'italic', d- p; n) |3 d( t4 p
- 'fontWeight' => '400',
- V9 L. n' ?: X0 g) U - 'src' => 'https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVIUwaERZjA.woff2' J- c: p& k5 ^- _. X0 b
- ),* Y( t# ?- S& |4 M/ G4 L" c
- ),
4 q4 T r- f( b/ V - ),
4 ?! }' d. _5 }7 f$ a - ),
- u* y& H* V; A3 a - 'categories' => [ 'sans-serif' ],
/ n1 p2 J4 B/ l' r" C7 [ - ),
$ X1 z! j7 \" r2 ^ - array(6 @+ ^1 ]8 q, `) ]8 N7 |
- 'font_family_settings' => ( P0 ]! t+ F2 Y) ^1 V
- array () C& A" A9 w3 E6 c f7 O0 c0 ~
- 'fontFamily' => 'Monoton, system-ui',3 F& N% e# o1 }
- 'slug' => 'monoton',4 r3 d J4 ?1 |
- 'name' => 'Monoton',# P: f: f7 b# d2 J2 F+ @' g, F1 M( a
- 'fontFace' => (
9 `; t0 @) K. a- d - array (7 G/ y' n/ l- j. Z' s- r% X" ~
- 'fontFamily' => 'Monoton',3 {. F- T! N- b; w8 t$ V# b
- 'fontStyle' => 'normal',
3 {' r1 j8 l# |: P' G - 'fontWeight' => '400',
( \( }" B+ o# z# h; k/ c - 'src' => 'https://fonts.gstatic.com/s/monoton/v19/5h1aiZUrOngCibe4fkPBQ2S7FU8.woff2',
5 y0 O5 N% U) g! k! n# ~ - 'preview' => 'https://s.w.org/images/fonts/17.7/previews/monoton/monoton-400-normal.svg'! M, ~5 c+ N: I- b
- ),3 Z9 ~9 j3 }7 m" Q7 j& @
- ),$ d4 W% B' v$ W1 X
- )
5 n- C: U# ]4 r( ~3 A% ? - ),
: \5 n$ {" g e& h" V. c1 r - 'categories' => [ 'display' ],( l, J0 d4 Z4 B9 L N' C( I9 S
- ),
/ M# b* j& ^, y! S8 R- i5 ~ - array(
9 t+ W2 @/ B# k - 'font_family_settings' => (3 W8 A, x3 i! [/ K4 c4 ~
- array (
! p* C, X j2 ?2 Z) x/ s* L! x - 'fontFamily' => 'Arial, Helvetica, Tahoma, Geneva, sans-serif',- t' w7 D0 a- e0 f2 q! m
- 'slug' => 'arial',9 Z- L: f4 r3 Q+ G( ~
- 'name' => 'Arial',5 m+ R( n- t, x" ~/ [8 x
- )
% o; x+ v, D/ [' y - ),
5 A" v9 [0 a' r* l! G( a% r - 'categories' => [ 'sans-serif' ],
7 o; ]* c& S) ?; [& c - )," y( c+ k b) o* f* t, l( f
- ];
( f9 H( d: Y% r1 o, o2 p) v* n -
5 @* ?7 U+ u1 z8 @ - $categories = [+ e. O# l; U0 ? Q
- array(
; L: |3 A8 c$ y m - 'name' => _x( 'Display', 'Font category name' ),
& N4 ]+ B8 x+ c E2 P - 'slug' => 'display',. l0 F& @. F2 ?9 _8 q% _
- ),3 v' x2 Y3 h6 {2 Y9 g
- array(
' W8 a; d- B" Y) e1 w - 'name' => _x( 'Sans Serif', 'Font category name' ),
0 U$ q3 m |5 u - 'slug' => 'sans-serif',: x9 t) t |( Y3 R6 `" M3 X
- ),
+ a' m `4 ?- }- r O1 T - ];, N* |' V% v) v$ U% }9 n
- $config = array (, a! p, Z& r& H8 @. W7 {, A2 t9 g
- 'name' => _x( 'My font collection', 'Font collection name' ),4 L1 K* c5 ]) M H; N* j
- 'description' => _x( 'A collection of my favorite fonts.', 'Font collection description' ),# R9 C; P+ K: v; ]" a3 R4 y3 X$ @9 `
- 'font_families' => $font_families,
1 R% ]' k" T, P s0 B9 y% g( d - 'categories' => $categories,7 |/ V+ M) t F1 L }9 A: u
- );* o' X, n$ w( u
- wp_register_font_collection ( 'my-font-collection', $config );
复制代码请注意, Font Collection 数组的name和description字段必须是可翻译的,这可以通过将字符串包装在 _x() 函数中来实现。字体系列名称通常不被翻译。有关更多信息和背景讨论,请参阅 #60509。 该字段的 JSON 格式font_families可以是本地路径或指向 JSON 文件的远程URL 。 9 }1 h8 D5 i' @
删除字体集可以使用wp_unregister_font_collection()函数禁用字体集合。这是禁用默认字体集合的示例: - add_action( 'init', function() {/ a: S" c7 O9 h2 Y
- wp_unregister_font_collection( 'default-font-collection' );
) x7 H; u3 [; `) F' W4 h- s - } );
复制代码 ) }2 {$ f7 y) M% I
安装和激活字体当字体被“激活”时,主题的全局样式设置将被更新,以便包含该字体以及主题定义的字体,并且可以在全局样式和单个块的版式设置中使用。 切换到新主题时,需要重新激活已安装的字体,以更新该主题的站点全局样式设置。如果重置主题的全局样式,这将停用所有已安装的字体,但它们将保留在站点上,并且可以根据需要重新激活。 此外,字体库可用于停用主题中包含的字体(如果不需要),以提高网站的加载性能。
. K( V! O( t2 y' `6 K; X自定义字体上传目录请注意,以下一些详细信息(例如函数名称)可能在 6.5 版本之前发生更改。有关更多信息,请参阅 #60751和古腾堡问题 #59699。 默认情况下,字体将上传到该wp-content/fonts目录。但是,可以使用 font_dir 过滤器根据需要自定义该位置。对于不支持修改wp-content目录的安装,wp-content/uploads/fonts将用作后备目录。 可以使用 wp_get_font_dir()返回字体上传目录的位置。 下面的示例将字体目录更改为 WordPress “Uploads”目录(默认情况下为wp-content/uploads): - function alter_wp_fonts_dir( $defaults ) {5 n5 j: A& H0 A5 @% a1 ^& L
- $wp_upload_dir = wp_get_upload_dir();' M+ i8 f& z. s
- $uploads_basedir = $wp_upload_dir['basedir'];. l$ E! t: B% b- l* k& G
- $uploads_baseurl = $wp_upload_dir['baseurl'];1 t" b$ j2 n7 p" r1 O8 u' x) D+ M. C ]
- $fonts_dir = $uploads_basedir . '/fonts';
7 k" g: R* m6 J2 m f - // Generate the URL for the fonts directory from the font dir.
7 b& x8 ?: O i6 V1 a* N' H4 p - $fonts_url = str_replace( $uploads_basedir, $uploads_baseurl, $fonts_dir );
+ ? I0 W5 t7 }2 I9 b5 V0 X - $defaults['path'] = $fonts_dir;- c/ e- G. m6 ]
- $defaults['url'] = $fonts_url;
, i9 r4 l* z7 J4 D. b+ R3 C2 G: A - return $defaults;0 h3 Z7 \% e/ V7 h# O
- }
' e. }% U, a4 H) B5 c9 D* ? - add_filter( 'font_dir', 'alter_wp_fonts_dir' );
复制代码修改上传位置时,重要的是要确保所选位置存在并且设置了适当的读/写权限。 与wp-content/uploads目录一样,字体上传目录不会坚持 wp_is_file_mod_allowed/DISALLOW_FILE_MODS 以防止字体上传。 7 U/ X% ~% S+ }2 L( m" M
如何禁用字体库默认情况下可通过编辑器访问字体库。
. E( U0 T, E1 }; l1 {, I禁用用户界面可以使用过滤器来禁用 UI 来自定义编辑器设置: - function disable_font_library_ui( $editor_settings ) {
0 _2 h' V% L: W# w - $editor_settings['fontLibraryEnabled'] = false;
% m7 s% ^& p5 {+ {) U. m7 V* e - return $editor_settings; % _/ A- p) O( }& M) R; z, D
- }
2 W) H. z7 R I - add_filter( 'block_editor_settings_all', 'disable_font_library_ui' );
复制代码 禁用REST API该unregister_post_type()函数可用于删除与字体库关联的帖子类型,并通过扩展 REST API: - add_action( 'init', function() {9 i- i" K8 Q2 K
- unregister_post_type( 'wp_font_family' );
6 e" r h6 L2 g' m, S$ M; t - unregister_post_type( 'wp_font_face' );/ @# L& n( M" a" v
- } );
复制代码这允许扩展程序禁用字体库,同时保留用于管理活动主题提供的字体的 UI。 2 F% c4 [/ Q1 [8 l7 f
新的 REST API8 C+ c$ g4 s0 C$ [, @
字体库功能引入了三个新的 REST API 端点: 1 w2 ?5 M3 U* U1 F* e
0 v' R) Y! q4 I, J! K |