为了提升网站加载速度和保护隐私，许多站长选择将字体文件本地托管，而不依赖外部服务如 Google Fonts。本文介绍在 GeneratePress 主题环境下，字体文件下载并本地托管的具体步骤。
1. 下载字体文件
使用 Google Fonts Helper 等工具，搜索并选择所需字体。勾选必要的字体变体，避免增加页面负担。跳过 CSS 代码复制，下载字体文件压缩包并解压。
2. 上传字体文件
WordPress 媒体库默认限制字体文件上传。
推荐使用“Code Snippets”插件操作，避免直接修改主题文件带来的风险。
在插件中新增代码片段，粘贴打开字体文件上传权限的函数代码。
保存并激活该代码片段后，就能在媒体库上传所有解压后的字体文件。
添加以下 PHP 代码，临时开放字体文件上传权限（放入子主题 functions.php 或用代码片段插件管理）：
add_filter( ‘upload_mimes’, function( $mimes ) {
$mimes[‘woff’] = ‘application/x-font-woff’;
$mimes[‘woff2’] = ‘font/woff2’;
$mimes[‘ttf’] = ‘application/x-font-ttf’;
$mimes[‘svg’] = ‘image/svg+xml’;
$mimes[‘eot’] = ‘application/vnd.ms-fontobject’;
return $mimes;
} );
上传解压后的字体文件，上传后建议删除该代码。
3. 获取字体文件链接
复制任意字体文件完整 URL，如： http://your-site/wp-content/uploads/2019/02/font-name.woff2
去掉文件名，仅保留目录路径，作为 CSS 路径使用。http://your-site/wp-content/uploads/2019/02/
4. 生成并添加 @font-face CSS
让我们回到下载字体文件的 Google Fonts Helper 。
在 Google Fonts Helper 中填入目录路径。http://your-site/wp-content/uploads/2019/02/复制生成的完整 CSS 代码。粘贴至 WordPress 后台“外观” → “自定义” → “附加 CSS”，或子主题样式文件。
5. 在 GeneratePress 主题中添加本地字体
进入“外观” → “自定义” → “排版”。
添加字体名称（与 CSS font-family 一致）。关闭 Google 字体选项，启用本地字体。
设置字体应用范围，保存生效。
6. 让本地字体在 WordPress 块编辑器显示
块编辑器默认不加载自定义 @font-face CSS。
若 CSS 在“附加 CSS”，添加代码注入编辑器：
add_filter( ‘block_editor_settings_all’, function( $editor_settings ) {
$css = wp_get_custom_css_post()->post_content;
$editor_settings[‘styles’][] = array( ‘css’ => $css );
return $editor_settings;
} );
若 CSS 在子主题 style.css，添加代码：
add_filter( ‘generate_editor_styles’, function( $editor_styles ) {
$editor_styles[] = ‘style.css’;
return $editor_styles;
} );
完成后，编辑器即可正确显示本地字体。
总结
本地托管字体提升加载速度，减少第三方依赖。结合 GeneratePress 主题的排版功能，完成字体文件下载、上传权限开启、CSS 添加及主题和编辑器字体配置，能够实现字体的完美本地托管，提升网站视觉和性能表现。