大版本更新
一口气全面统一博客样式,移除部分冗余导航页面,更专注内容展示。
不因虚度年华而悔恨,不因碌碌无为而羞愧
文章怎么写、瞬间怎么发、友链时间线网址导航怎么维护——本站内容系统的日常操作都在这里。

安装与设置完成后,剩下的就是内容工作了。这篇覆盖本站内容系统的日常操作:写文章、发瞬间、维护数据页面,以及好用的 Markdown 扩展语法。
文章放在内容仓 content/posts/ 下,Markdown 即可,也支持 MDX。最小 frontmatter 长这样:
1---2title: 我的第一篇文章3published: 2026-08-104description: 一句话摘要,会显示在列表和分享卡片里5tags: [随笔]6category: 生活7---frontmatter 之后就是正文。几条本站约定:
posts/tech/、posts/philosophy/,URL 会带上目录名(/posts/tech/xxx/)draft: true,文章只进构建不进正式列表pnpm new-post 文件名 可以生成骨架,再挪进对应子目录除了标准 Markdown,Shirone 还内置几组扩展,写教程尤其好用:
提示块(admonition),支持 tip / warning / details 等类型,details 默认折叠:
1:::tip[小贴士]2这是提示内容3:::此外还有 Mermaid 流程图、数学公式、代码块增强(复制按钮、行高亮)、图片画廊,直接按各自的标准语法写即可,无需配置。
瞬间是轻量的短内容,类似说说。文件放 content/moments/,命名 YYYY-MM-DD-标识.md:
1---2content: 网站换新背景图了3date: 2026-08-08 21:30:004location: 河南-郑州5images:6 - src: https://tu.fqzlr.com/bg.webp7 alt: 新背景图8---带 images 就是图文瞬间,纯文字则只写 content。侧栏的”瞬间”页面按时间倒序展示。
几类”列表型”页面由内容仓 data/ 下的 TypeScript 文件驱动,改完同样 pnpm content:sync 生效:
| 文件 | 页面 | 说明 |
|---|---|---|
friends.ts | 友链 | 每条含名称、头像、链接、描述 |
timeline.ts | 时间线 | 按年份记录事件,milestone 标记重点节点 |
compass.ts | 网址导航 | 分组的网址收藏,icon 可用图标名或图片 URL |
projects.ts | 项目展示 | 名称、封面、技术栈、链接 |
采用内容分离模式后,我的日常流程是:
1# 内容仓里写作(.env 指向本地内容仓时同步是实时的)2pnpm content:sync # 物化最新内容到主题3pnpm dev # 本地预览4pnpm content:validate # 发布前校验5git push # 内容仓与主题仓各自推送内容仓 push 之后,如果部署流水线绑定的是主题仓,记得主题仓也要触发一次构建才能带上最新内容。
站点自带 Pagefind 全文搜索(pnpm build 时自动建立索引,本地 pnpm dev 下搜不到是正常的,构建后才有);RSS 与 sitemap 默认输出,配合 site.yaml 里的正式网址,搜索引擎收录无需额外操作。
到这里,安装、设置、使用三篇就齐了。建站只是开始,持续写下去才是博客的意义。
生成精美分享图或复制链接,与更多人分享本文。
最后更新于 ,距今已过 71 天
部分内容可能已过时