美妙社  ›  WordPress

WordPress 6.5 新功能:字体库 详解

DivivitYan懵逼VIP2 WP教程 2024-4-3 23:25:111.7K 次点击 阅读模式     
字体库 在 WordPress 6.5 中引入,允许用户直接在编辑器中管理字体。它附带了一组 API,允许开发人员控制、调整和禁用其行为。7 R2 E( P7 o" n3 i' |, j. C
4 l# [- U& v8 J# G# W% x
字体集
字体集是用户可以通过编辑器安装的字体系列定义的列表。字体系列定义是theme.json格式中的一个fontFamily项。默认情况下,WordPress 6.5 允许用户选择加入 Google 字体集合列表。为了让网站保持GDPR合规性,安装 Google 字体会将文件下载到 WordPress 服务器。
注册字体集合后,它将出现在编辑器的字体库UI中。从这里,用户可以安装并激活该集合中的字体。
wp-65-font-library.jpg $ |" b8 s; j# k7 X

0 N" Q8 [, H0 |5 q1 C* z2 N  ?, _

' ^; p. x# h# N6 ?$ u7 m, p# J& G% ^添加字体集
可以使用wp_register_font_collection()函数添加新的字体集合。这可以通过以PHP或JSON格式提供字体系列及其字体列表作为字体集合数组的一部分来完成。
以下是在 PHP 中添加字体集合的示例:
  1. $font_families = [
    / c* b6 o7 Q) v& f9 X. u9 M) r
  2.         array(4 E3 ]% Y+ H( |& @. i" Y: V
  3.                 'font_family_settings' => (
    6 s% v" J' F  J2 {# Z. {
  4.                         array (# J/ r6 n( [8 A0 T3 E
  5.                                 'fontFamily' => 'Open Sans, sans-serif',' M3 p( z& Y  ?) b, `2 W6 G* v2 j
  6.                                 'slug'       => 'open-sans',6 B) c0 f9 @/ F' x: ]9 t* t9 C9 ^. _
  7.                                 'name'       => 'Open Sans',' X8 C% G0 @" k
  8.                                 'fontFace'   => (
    % O/ h. e9 I# L  A5 P+ E) Z' G
  9.                                         array (
    $ R- c1 L( [5 s1 J, x
  10.                                                         'fontFamily' => 'Open Sans',  F; u! s* ?7 n" i0 h
  11.                                                         'fontStyle'  => 'normal',- ~6 L- k0 n4 b  _. n: O3 x7 s; V* m
  12.                                                         'fontWeight' => '300',- o  @  k7 d0 u- r; D' t
  13.                                                         'src'        => 'https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4iY1M2xLER.woff2'
    9 ~9 \. k& U- F! k; W
  14.                                         ),7 ^; C) _) g% Z% X
  15.                                         array (3 F  c1 N* Z# X2 n" q
  16.                                                         'fontFamily' => 'Open Sans',5 `5 ]& ?9 O5 ~3 K2 g7 P
  17.                                                         'fontStyle'  => 'italic',  W; |$ p) f8 m9 f7 c7 I6 H
  18.                                                         'fontWeight' => '400',
    / E5 n9 W% V7 E3 Q8 f
  19.                                                         'src'        => 'https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVIUwaERZjA.woff2'
    + N& Q5 a1 O1 w' d
  20.                                         ),: U' |3 p, ^8 U! P
  21.                                 ),: X5 w' R8 E) e2 C
  22.                         ),2 J* `/ z( f9 @; S, W/ ?
  23.                 ),
    , Q: E% r& ~' d. [- \3 r1 c
  24.                 'categories' => [ 'sans-serif' ],
    6 }$ s: Q3 M0 Z( y7 t! i
  25.         ),
    / w- d1 W: n  a' f. H, Q
  26.         array(' [; D/ k$ Y7 u7 @  B- |2 @
  27.                 'font_family_settings' => (, j8 |& l3 l/ @: @, @5 d3 q# w+ a
  28.                         array (
    ! l* I9 {) t2 k9 Q& |
  29.                                 'fontFamily' => 'Monoton, system-ui',) c) Z- ^* ~0 r' z7 @8 w# X8 Y' ~" H
  30.                                 'slug'       => 'monoton',& j# o' {3 x$ z5 `  K
  31.                                 'name'       => 'Monoton',5 ^7 U" l7 T) `$ w
  32.                                 'fontFace'   => (
    % W% U2 N& |( o
  33.                                         array (
    : h! y' R3 z0 z9 `6 ?
  34.                                                         'fontFamily' => 'Monoton',
    : U6 O5 Q2 ^4 [. w3 j4 H0 f8 B
  35.                                                         'fontStyle'  => 'normal',
    $ u. f- q* p* }( W7 j( A1 t8 i* B
  36.                                                         'fontWeight' => '400',
    4 ~$ n) u2 f% |* q/ p6 S5 v( U
  37.                                                         'src'        => 'https://fonts.gstatic.com/s/monoton/v19/5h1aiZUrOngCibe4fkPBQ2S7FU8.woff2',
    ' T& D% U- z, e6 g
  38.                                                         'preview'    => 'https://s.w.org/images/fonts/17.7/previews/monoton/monoton-400-normal.svg'
    2 f9 }+ u! n( I4 i
  39.                                         ),
    5 }4 B5 k  F: ?0 \1 V, R6 p
  40.                                 ),( z: J, y1 i8 R  l7 ^- `; y5 p
  41.                         )
    $ y" m4 Q, B& d& X8 o
  42.                 ),' v. U& l5 g: }) [3 A9 G
  43.                 'categories' => [ 'display' ],& z$ c. o, i2 N0 Q9 i6 W
  44.         ),8 l- {- r- I1 e7 C4 C1 o
  45.         array(3 O. Q2 N% A4 M2 C  A0 ?6 }
  46.                 'font_family_settings' => (
    ( j6 {3 e- X2 m6 n; n  H5 ]% {. i- h
  47.                         array (
    0 R( q  M9 C2 ]6 [
  48.                                 'fontFamily' => 'Arial, Helvetica, Tahoma, Geneva, sans-serif',
    ; f$ k8 \) i- Y. M" }6 W- C
  49.                                 'slug'       => 'arial',
    " ~: w+ n% o# H9 ^$ A
  50.                                 'name'       => 'Arial',$ F" D# |$ b. h. j( n" o" O+ u+ \3 J
  51.                         )' B2 U4 H- k& x- x3 P
  52.                 ),& N5 C- l- r# l4 k+ ~1 [) U. l
  53.                 'categories' => [ 'sans-serif' ],
    + W) S# p1 j1 P' X+ W8 H! t
  54.         ),- L9 V# t! {0 u/ v3 |' p
  55. ];: |7 j, A( d% B) T8 [% O
  56.         ; f7 g2 `8 ^3 d- r5 x$ E
  57. $categories = [
    - W+ S/ q; y1 L7 ^# t: P
  58.         array(( {" z: \3 o9 D; o0 I/ _
  59.         'name' => _x( 'Display', 'Font category name' ),7 j6 E0 C+ i! F
  60.                 'slug' => 'display',' a! t( [% y7 d- L' j8 `( T, y
  61.         ),0 m$ J3 {7 D6 h
  62.         array(
    ! n7 n+ N: b7 }* G9 a+ k
  63.                 'name' => _x( 'Sans Serif', 'Font category name' ),5 L$ Y8 ]4 U, m$ y
  64.                 'slug' => 'sans-serif',4 j' ~# h3 Y, y
  65.         ),
    # U) j) U* ^4 B6 s
  66. ];+ S4 R! r( N$ Q* z" e) `8 l
  67. $config = array (% T7 v; d4 x3 Q" l: m
  68.         'name'          => _x( 'My font collection', 'Font collection name' ),$ x- s7 {. w/ I/ X3 u  p. h9 t: _
  69.         'description'   => _x(  'A collection of my favorite fonts.', 'Font collection description' ),
    3 J9 H# }9 @+ c$ ~' x
  70.         'font_families' => $font_families,
    ( M* [" {& B& p  R
  71.         'categories'    => $categories,' g! w% e; s5 S0 O+ h  Y
  72. );1 E) \. r' g2 @" o9 y5 l6 i
  73. wp_register_font_collection ( 'my-font-collection', $config );
复制代码
请注意, Font Collection 数组的name和description字段必须是可翻译的,这可以通过将字符串包装在_x() 函数中来实现。字体系列名称通常不被翻译。有关更多信息和背景讨论,请参阅#60509
该字段的 JSON 格式font_families可以是本地路径或指向 JSON 文件的远程URL 。
7 V% K5 f6 l) q$ W9 M, R
删除字体集
可以使用wp_unregister_font_collection()函数禁用字体集合。这是禁用默认字体集合的示例:
  1. add_action( 'init', function() {3 U0 y$ W4 h+ g, s: T
  2.         wp_unregister_font_collection( 'default-font-collection' );+ t8 ~# w6 q3 R
  3. } );
复制代码
有关更多信息,请参阅#57980
& }# N. k* {7 k
安装和激活字体
字体定义基于theme.json 格式进行字体设置。将字体“安装”到网站会将集合中的 theme.json 格式设置保存到数据库中,因此可以为任何主题激活该字体。
当字体被“激活”时,主题的全局样式设置将被更新,以便包含该字体以及主题定义的字体,并且可以在全局样式和单个块的版式设置中使用。
切换到新主题时,需要重新激活已安装的字体,以更新该主题的站点全局样式设置。如果重置主题的全局样式,这将停用所有已安装的字体,但它们将保留在站点上,并且可以根据需要重新激活。
此外,字体库可用于停用主题中包含的字体(如果不需要),以提高网站的加载性能。
" x  _' r0 i* ~3 ?: }5 e
自定义字体上传目录
请注意,以下一些详细信息(例如函数名称)可能在 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 ) {7 U/ W9 B/ {! N& }. `
  2.         $wp_upload_dir = wp_get_upload_dir();5 {" A" q* ~( {+ e) v& k4 V  F: x
  3.         $uploads_basedir = $wp_upload_dir['basedir'];" l- ^3 S% H& W0 V1 Q( L' X
  4.         $uploads_baseurl = $wp_upload_dir['baseurl'];
    8 |# s- I7 N+ B; K4 ^+ E5 p
  5.         $fonts_dir = $uploads_basedir . '/fonts';
    + W) b. C8 M  x) i$ c/ i  c  J
  6.         // Generate the URL for the fonts directory from the font dir.1 w5 S4 M9 t$ M2 V; O* R4 V+ G
  7.         $fonts_url = str_replace( $uploads_basedir, $uploads_baseurl, $fonts_dir );7 `7 t3 U7 m4 {3 Q  Z; [- B
  8.         $defaults['path'] = $fonts_dir;
    - {6 z8 d, a* P; k( o1 k4 R0 L. _. E
  9.         $defaults['url']  = $fonts_url;7 H7 T$ ^* F( E+ {& F% h$ U+ C
  10.         return $defaults;
    / \& A5 c. I1 y6 B( J2 P
  11. }% M. n( G; ?( x, X7 u
  12. add_filter( 'font_dir', 'alter_wp_fonts_dir' );
复制代码
修改上传位置时,重要的是要确保所选位置存在并且设置了适当的读/写权限。
与wp-content/uploads目录一样,字体上传目录不会坚持 wp_is_file_mod_allowed/DISALLOW_FILE_MODS 以防止字体上传。
有关更多信息,请参阅#59417这篇文章
! H) A( B  z+ t; o0 y- Y; r
如何禁用字体库
默认情况下可通过编辑器访问字体库。

) q  p- [6 O' T5 p& u4 c# _( |7 X! r+ d禁用用户界面
可以使用过滤器来禁用 UI 来自定义编辑器设置:
  1. function disable_font_library_ui( $editor_settings ) {
    3 |/ Y5 ]" v8 x! K  U# M# F- k6 i9 B
  2.             $editor_settings['fontLibraryEnabled'] = false;/ e9 n  C4 v" q, c: d1 R
  3.             return $editor_settings;
    # p& ]% L; G, E3 m+ e) |
  4. }6 j. b2 N& s; A4 Z
  5. add_filter( 'block_editor_settings_all', 'disable_font_library_ui' );
复制代码
禁用REST API
该unregister_post_type()函数可用于删除与字体库关联的帖子类型,并通过扩展 REST API:
  1. add_action( 'init', function() {
    0 B! b. l0 D- z( }) n9 t0 ~+ V" m
  2.             unregister_post_type( 'wp_font_family' );
    , i7 f5 B# p7 M3 n3 m% Q) X9 z
  3.             unregister_post_type( 'wp_font_face' );, {4 j$ |+ N9 d! r' s% c9 T
  4. } );
复制代码
这允许扩展程序禁用字体库,同时保留用于管理活动主题提供的字体的 UI。
有关更多信息,请参阅#55275#57818
9 r( ?5 ~! k: [% @; ?) w! C
新的 REST API
0 k5 o, T* X# ~2 R+ @! r6 p9 k
字体库功能引入了三个新的 REST API 端点:
有关每个新端点的详细文档,请参阅REST API 手册#57616

0 h3 ]( Q: j( b6 R9 [5 a; r) T' M; Z' Z. \0 ^( O1 `5 _
啊舒服sdf
目前尚无回复
添加一条新回复
您需要登录后才可以回帖 登录 | 立即注册

本节点积分规则
站点统计  ·  手机版  ·  小黑屋  ·  帮助  ·  Archiver  ·  手机版  ·  小黑屋  ·  40 人在线  最高记录 513  ·  TOP
愿孤独的人都会唱歌,愿漂泊的人都有酒喝!
World is powered by solitude
GMT+8, 2024-11-21 17:45, Processed in 0.412859 second(s), 186 queries .

  Inspire by v2ex, Powered by Discuz! X3.5, Template by MeiMiaoShe.Com, © 2001-2024 Discuz! Team.