惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

J
Java Code Geeks
IT之家
IT之家
爱范儿
爱范儿
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
博客园_首页
Blog — PlanetScale
Blog — PlanetScale
V
Visual Studio Blog
云风的 BLOG
云风的 BLOG
MyScale Blog
MyScale Blog
阮一峰的网络日志
阮一峰的网络日志
Stack Overflow Blog
Stack Overflow Blog
酷 壳 – CoolShell
酷 壳 – CoolShell
GbyAI
GbyAI
V
V2EX
N
Netflix TechBlog - Medium
Vercel News
Vercel News
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
T
The Blog of Author Tim Ferriss
量子位
博客园 - Franky
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
博客园 - 司徒正美
月光博客
月光博客
F
Fortinet All Blogs

Flatpaper Demo

FlatPaper(v0.4.0) 新特性:沉浸式手帐风留言板,把评论变成贴纸盲盒 | Flatpaper Demo Hexo 中 `marked.smartypants` 与 `quotes` 配置详解 | Flatpaper Demo FlatPaper 文章顶部图:top_img 与 post_top_img 配置 | Flatpaper Demo FlatPaper 主题重磅更新:优雅的朋友圈 (Friend Circle) 信息流 | Flatpaper Demo FlatPaper 首页 Hero:开屏、背景图与贴纸配置 | Flatpaper Demo 主题效果总览:文章块与交互组件预览 | Flatpaper Demo 更新日志:FlatPaper 现已支持赞赏码 | Flatpaper Demo FlatPaper 内置图标速查 | Flatpaper Demo Hello World | Flatpaper Demo 多级标题测试:从一级标题到六级标题 | Flatpaper Demo 多级标题测试:从一级标题到六级标题 外链与脚注测试:链接样式、长 URL 与引用来源 | Flatpaper Demo 外链与脚注测试:链接样式、长 URL 与引用来源 用 VitePress 风格的 note 容器语法 | Flatpaper Demo 用 VitePress 风格的 note 容器语法 图片排版预览:多图、图注与长图测试 | Flatpaper Demo 图片排版预览:多图、图注与长图测试 多语言代码示例:用于测试代码高亮 | Flatpaper Demo 多语言代码示例:用于测试代码高亮 在 Hexo 中使用 NOTE 提示块 | Flatpaper Demo 在 Hexo 中使用 NOTE 提示块 Hello World FlatPaper 主题页面检查清单 | Flatpaper Demo FlatPaper 主题页面检查清单 Markdown 元素展示:表格、代码与引用 | Flatpaper Demo Markdown 元素展示:表格、代码与引用 FlatPaper 设计札记:纸感、留白与轻量界面 | Flatpaper Demo FlatPaper 设计札记:纸感、留白与轻量界面 周末散步记录:从街角咖啡店到河岸 | Flatpaper Demo 周末散步记录:从街角咖啡店到河岸
FlatPaper 现在支持 Google Fonts 了 | Flatpaper Demo
Author · 2026-06-23 · via Flatpaper Demo
主题开发

FlatPaper 现在支持通过主题配置加载 Google Fonts 了。你可以给正文和代码块分别设置字体,也可以配置 CDN 域名,用镜像服务替代默认的 fonts.googleapis.com

这个功能默认关闭,不会影响已有站点。开启后,主题会在页面 <head> 里注入 Google Fonts 样式表,并用 CSS 变量把字体应用到正文或代码块。

演示站使用配置

当前演示站使用了这组配置:

1
2
3
4
5
6
7
8
9
10
11


google_fonts:
enable: true
cdn: https://fonts.loli.net

fonts:
- Caveat

mono:
- Source Code Pro

fonts 用于正文,按顺序填写字体名称即可;mono 用于代码块,也按顺序填写等宽字体名称。如果只想改代码字体,可以只配置 mono,不写 fonts

字段说明

字段 说明
enable 是否启用 Google Fonts 加载,默认 false
cdn Google Fonts 样式表域名,可改为镜像域名
fonts 正文字体列表,越靠前优先级越高
mono 代码块等宽字体列表,越靠前优先级越高

字体加载固定使用 display=swap,所以即使远程字体加载较慢,页面也会先用本地 fallback 字体显示,不会长时间空白。

小提示

  • 字体名称直接写 Google Fonts 里的名称即可,不需要写复杂的 family= 查询参数。
  • cdn 只负责替换 Google Fonts CSS 的域名;实际字体文件地址由返回的 CSS 决定。
  • 中文字体通常体积较大,建议只加载确实需要的字体。
  • Caveat 这样的字体主要覆盖拉丁字符,中文仍会回退到主题默认中文字体栈。