用 Google 字体虽好看,但每次都要向 Google 服务器请求,拖慢首屏。把字体「本地化」到自己的服务器,能显著提升加载速度。本文讲 Bricks 站怎么落地化 Google 字体。
为什么要本地化 Google 字体
Google 字体默认从 fonts.googleapis.com 加载,国内或弱网环境经常卡。本地化后,字体文件托管在你自己的服务器/CDN 上,减少外部请求、降低隐私合规风险,也能配合缓存提速。
方案一:用性能插件本地化
像 Perfmatters 这类轻量性能插件,内置「本地化 Google 字体」功能:开启后它会把用到的 Google 字体下载到本地并改写引用地址,你基本零配置。适合不想碰代码的站长。
方案二:手动下载托管
- 从 Google Fonts 下载需要的字体文件(woff2 优先,体积小)。
- 上传到主题目录或 CDN。
- 用 @font-face 在自定义 CSS 里声明字体,并让 Bricks 的字体设置指向这个本地字体族。 这样彻底不依赖 Google 域名。
注意事项
- 留意字体授权,确认你下载的字体允许自托管。
- 本地化后记得清缓存、用测速工具验证外部字体请求已消失。
- 字体文件别贪多,只本地化真正用到的字重,控制体积。
小结
本地化 Google 字体是 Bricks 站提速的性价比动作:用 Perfmatters 等插件一键搞定,或手动 @font-face 托管。目标只有一个——让字体不再成为首屏瓶颈。
内容说明(整理稿):本文选题与步骤框架参考自竞对站 trybricks.com / qinbanliang 站的公开教程(源多为截图驱动教程,正文极薄),内容为 BricksWiki 基于 Bricks 官方公开文档与通用实操经验重写整理,非原文逐字翻译,也不构成官方文档。操作入口/路径以你当前 Bricks 版本为准,实操前建议对照官方文档核对。
延伸阅读
Bricks 安装与基础设置:从启用子主题到性能优化
从官网下载、启用 Bricks Child 子主题,到 General、Builder Access、性能、全局 Custom Code 等基础设置逐项讲清,附各开关的推荐配置。
tutorialBricks 网站速度究竟如何——实测与提速清单
教程:Bricks 站快不快,取决于生成代码质量和你的优化动作。拆解 Bricks 的性能底子,给你一套能直接抄的提速清单。
tutorialBricks 用 ACF Checkbox 字段渲染自定义 SVG 图标列表
教程:Bricks 用 ACF Checkbox 字段渲染自定义 SVG 图标列表——acf 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
tutorialBricks 按 ACF Gallery 图片数量做动态条件输出
教程:Bricks 按 ACF Gallery 图片数量做动态条件输出——acf 附完整代码可直接复用,适合外贸独立站与 WordPress 开发者。
