字体库 在 WordPress 6.5 中引入,允许用户直接在编辑器中管理字体。它附带了一组 API,允许开发人员控制、调整和禁用其行为。- a; p& E/ ]+ ~. r! }. c
w0 K' B x7 w$ C" ]8 S8 A
字体集字体集是用户可以通过编辑器安装的字体系列定义的列表。字体系列定义是theme.json格式中的一个fontFamily项。默认情况下,WordPress 6.5 允许用户选择加入 Google 字体集合列表。为了让网站保持GDPR合规性,安装 Google 字体会将文件下载到 WordPress 服务器。 注册字体集合后,它将出现在编辑器的字体库UI中。从这里,用户可以安装并激活该集合中的字体。
8 U- E7 l. m6 `, `% }4 a
+ [& z' }0 d: E
2 d) a7 U) C, ^5 [" w1 |# \添加字体集可以使用wp_register_font_collection()函数添加新的字体集合。这可以通过以PHP或JSON格式提供字体系列及其字体列表作为字体集合数组的一部分来完成。 以下是在 PHP 中添加字体集合的示例: - $font_families = [3 `3 W1 g, J& t' o
- array(. u$ W3 z0 {% q- M0 q- N: U8 I
- 'font_family_settings' => (
* I5 z! ?8 ^- u- A - array (
- F5 [; I, K% x - 'fontFamily' => 'Open Sans, sans-serif',2 N, t6 }% v% n8 _: B
- 'slug' => 'open-sans',
. d" F. W4 l1 G. B3 x. @ - 'name' => 'Open Sans',
! `' z4 r/ I; J2 [0 ]1 i& j- z1 S! x - 'fontFace' => (# L7 `' d: H5 o% B1 S9 \& _7 i, d
- array (6 W2 T4 }/ U; J3 s
- 'fontFamily' => 'Open Sans',
1 e: Y+ k) v& L6 o - 'fontStyle' => 'normal',
; U1 _6 Y, Y g# g& u - 'fontWeight' => '300',/ t) t, @# \1 i8 R
- 'src' => 'https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4iY1M2xLER.woff2'
9 Y, D) r5 H* @1 G - ),
, |7 }7 k5 Q, Y# K, K! F# ^ - array (
, X& Q3 l. f; Q& v) a9 Y* R6 O - 'fontFamily' => 'Open Sans',3 y0 I0 e' o( ^) V7 f4 o" i
- 'fontStyle' => 'italic',8 T# R, N- R4 A6 h+ H, J* J! Z
- 'fontWeight' => '400',7 b% x* J6 U! r* L! _: M" G3 T
- 'src' => 'https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVIUwaERZjA.woff2'
( l+ V$ o- {( Y: ?8 g - ),0 q7 q- h/ d. i) D
- ),
. h( `( _7 v/ ?7 B q - ),
* H+ Q0 s3 x$ |; `* D6 o - ),: m, |- U* L' s* }9 F2 [
- 'categories' => [ 'sans-serif' ],2 Y. a" ?; `7 L3 _' u3 [( m0 D
- ),! e: K6 O5 E6 Z0 K% W
- array(- y9 n& ^% R i W( c: X% c
- 'font_family_settings' => (- E3 Q( B% O) k6 N( Y* _' ^
- array (! M q6 n* j* M. m& x# c
- 'fontFamily' => 'Monoton, system-ui',- b' Y! b# B9 |, B- @
- 'slug' => 'monoton',
0 K! ^3 H+ W0 j( t' c0 J - 'name' => 'Monoton',
$ I% D. G# X3 e2 ], P - 'fontFace' => (: {( O* o i# T2 |% ?
- array (
0 K" J4 a0 W- I0 J( D - 'fontFamily' => 'Monoton',% t% p: N9 \8 r0 R' B9 ^; U
- 'fontStyle' => 'normal',
7 M, [9 u& t! h# E' \% F0 F - 'fontWeight' => '400',7 T7 N' P% x/ h$ r2 ^
- 'src' => 'https://fonts.gstatic.com/s/monoton/v19/5h1aiZUrOngCibe4fkPBQ2S7FU8.woff2',# p7 H( w7 ?7 ?6 s) k' s8 f' \
- 'preview' => 'https://s.w.org/images/fonts/17.7/previews/monoton/monoton-400-normal.svg'
: _4 [( |) m7 k: [% J/ u- T! { - ),
4 b+ E6 M! w: x) {& V - ), Q) s$ |% n8 E. }( r+ _+ w/ _
- )
1 P( g7 ~8 o; K) V. W - ),- h, ^5 ^4 O, v6 Z' i+ L* A. L
- 'categories' => [ 'display' ],
. W8 \: K/ w M2 | v1 _ - ),. p) b; U. v0 @- `& v$ ?+ _8 _
- array(! m4 Q1 Q+ J ~- f& A
- 'font_family_settings' => (
m& T% ~$ _3 T1 i7 N) c7 D9 U - array (
$ ]8 j4 K& o" R. `4 D3 t - 'fontFamily' => 'Arial, Helvetica, Tahoma, Geneva, sans-serif',8 A: R$ Y! i6 g3 H) p7 M4 V- d! j2 A
- 'slug' => 'arial',
! }" J& ]9 b$ J( m: Y - 'name' => 'Arial',
2 Q+ K. H+ R( {! r2 }8 g" V - )
. G$ M% a6 X4 E/ ^0 J; A+ ? - ),
{# ~( R% L5 ?7 y: P - 'categories' => [ 'sans-serif' ],
6 T! i+ t4 M+ z% G" A - )," k% j+ u: q8 g0 ^( {( s- y
- ];9 U! p: t9 n2 ~2 x @( h
- / n: r9 x& S& K9 ~4 r1 u/ z
- $categories = [ _$ a8 `$ P i" u" R$ s3 p. M/ r
- array(. Y' Q0 v6 {, F( I( A
- 'name' => _x( 'Display', 'Font category name' ),
( q# | m2 }1 m& K0 ?" j9 ~ - 'slug' => 'display'," c8 B! G' {4 S8 h2 i
- ),1 r* @% }! X+ l* H' _6 Q
- array(
3 M9 o6 C9 F. S n) k+ r5 F - 'name' => _x( 'Sans Serif', 'Font category name' ),( d' J7 D2 N0 h \9 u# \- i
- 'slug' => 'sans-serif',
. d1 `$ i& b, S( [ - ),. `' ]: t. V7 S9 p
- ];
6 C! t* L k B& h" I - $config = array (
& I$ `/ A [3 ]. i5 ]* _- S( T9 {; e - 'name' => _x( 'My font collection', 'Font collection name' ),& J* [+ h! ?0 } W' `
- 'description' => _x( 'A collection of my favorite fonts.', 'Font collection description' ),3 g! w* C% c* S' r- y' w
- 'font_families' => $font_families,2 a4 V* z! y- H r- b p
- 'categories' => $categories,7 [( }) u( z6 Y) s. Y' U7 c
- ); N7 f- R/ E# j ^: K
- wp_register_font_collection ( 'my-font-collection', $config );
复制代码请注意, Font Collection 数组的name和description字段必须是可翻译的,这可以通过将字符串包装在 _x() 函数中来实现。字体系列名称通常不被翻译。有关更多信息和背景讨论,请参阅 #60509。 该字段的 JSON 格式font_families可以是本地路径或指向 JSON 文件的远程URL 。
W4 s: I/ h% r/ k) O删除字体集可以使用wp_unregister_font_collection()函数禁用字体集合。这是禁用默认字体集合的示例: - add_action( 'init', function() {
' F+ ?3 J5 C% Y$ h6 \ - wp_unregister_font_collection( 'default-font-collection' );8 C( r, S) Q r5 P" v' d
- } );
复制代码
. Z" L1 ~, X. n% \安装和激活字体当字体被“激活”时,主题的全局样式设置将被更新,以便包含该字体以及主题定义的字体,并且可以在全局样式和单个块的版式设置中使用。 切换到新主题时,需要重新激活已安装的字体,以更新该主题的站点全局样式设置。如果重置主题的全局样式,这将停用所有已安装的字体,但它们将保留在站点上,并且可以根据需要重新激活。 此外,字体库可用于停用主题中包含的字体(如果不需要),以提高网站的加载性能。
- D4 {$ u0 T: I. `& P自定义字体上传目录请注意,以下一些详细信息(例如函数名称)可能在 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 ) {2 ~: h B) I1 g% y7 j; a
- $wp_upload_dir = wp_get_upload_dir();
6 [7 k; p8 `0 F# z$ w6 h; n# S; N5 y) P - $uploads_basedir = $wp_upload_dir['basedir'];( d* }5 q- A* D8 R
- $uploads_baseurl = $wp_upload_dir['baseurl'];) M9 n9 m3 U' r4 n7 X( Z
- $fonts_dir = $uploads_basedir . '/fonts';6 f7 k8 R# X, r
- // Generate the URL for the fonts directory from the font dir.
& F" l! p) D! F- `1 \ - $fonts_url = str_replace( $uploads_basedir, $uploads_baseurl, $fonts_dir );
6 u! c- P# G" g# B, g7 n. q2 {: v - $defaults['path'] = $fonts_dir;' u5 A) G" m0 v) L" n
- $defaults['url'] = $fonts_url;
4 B8 U# Y( _" H: `( P$ w - return $defaults;' R: k; d* E4 U2 a& U
- }: R% T4 g: [1 z/ A6 Y6 M3 ?
- add_filter( 'font_dir', 'alter_wp_fonts_dir' );
复制代码修改上传位置时,重要的是要确保所选位置存在并且设置了适当的读/写权限。 与wp-content/uploads目录一样,字体上传目录不会坚持 wp_is_file_mod_allowed/DISALLOW_FILE_MODS 以防止字体上传。 7 s1 \" E, O: I
如何禁用字体库默认情况下可通过编辑器访问字体库。
3 I- }/ I" ?7 v9 g禁用用户界面可以使用过滤器来禁用 UI 来自定义编辑器设置: - function disable_font_library_ui( $editor_settings ) {
* `5 U- s4 E E. r7 i! G! ` - $editor_settings['fontLibraryEnabled'] = false;
, W% [: y! I J- p0 }& H3 r - return $editor_settings; # t. G* T' ^" P2 b" Q( R
- }' d; w6 r8 i* G! M* F6 h
- add_filter( 'block_editor_settings_all', 'disable_font_library_ui' );
复制代码 禁用REST API该unregister_post_type()函数可用于删除与字体库关联的帖子类型,并通过扩展 REST API: - add_action( 'init', function() {
/ t5 d; v$ Q5 z" ^" D& @ h4 r - unregister_post_type( 'wp_font_family' );/ K' j; K* `# @1 Y& g3 r
- unregister_post_type( 'wp_font_face' );) h% n( h$ {- O( `4 K6 w
- } );
复制代码这允许扩展程序禁用字体库,同时保留用于管理活动主题提供的字体的 UI。 # Z. j2 z; q3 B
新的 REST API! L7 y3 Z% W( z5 A9 `6 {8 p
字体库功能引入了三个新的 REST API 端点:
- s, w4 x; b4 S8 a
. l' P% \& J; p8 h |