跳至内容
← 所有文章

用 Codex Work 给博客做了一次装修

这次博客改造通过 Codex Work 完成,重点包括阅读布局与加载优化、图片和链接预览修复、导航与评论整理,以及文字封面、创作方式标记和手动维护的可折叠 AI 摘要。 桌面端首页还藏了刺猬生存小游戏,通关后可解锁《NEW GAME!》主题。作者提出需求、检查预览并决定取舍,Codex 负责实现和提交 PR;反复修改的成本降低后,个性化博客更容易从想法变成成品。

最近集中折腾了一下这个博客。文章还是放在 Notion 里,网站还是基于 NotionNext,不过外观和使用体验,开始更接近我自己想要的样子了。
这些修改都是通过 Codex Work 完成的。准确地说,目前这个仓库里的所有 PR 都是这样做的:我提出想法、看预览、继续提意见,Codex 负责读代码、实现修改和提交 PR。
给博客做一次装修:Codex Work 与 NotionNext
给博客做一次装修:Codex Work 与 NotionNext

这次主要改了什么

  • 把阅读体验重新整理了一遍。 首页改成紧凑的文章列表,正文调整行宽、字体和留白;标题、正文、评论与页脚也重新对齐。目录在宽屏时放到正文外侧,窄屏时可以收起,阅读时更容易把注意力放在内容上。阅读布局
  • 让加载和页面切换更顺手。 减少文章列表里不必要的 Notion 内容加载,调整字体和封面图的加载方式。打开文章时及时显示加载反馈,链接和导航也有了轻微的交互动效。加载优化 · 页面切换
  • 修掉图片和链接预览的小毛病。 处理首次打开 Notion 图片时偶发的 419 错误,以及图片、链接卡片和嵌套内容挤出正文的问题。预览图片失效时,保留还能正常阅读和点击的链接。图片修复
  • 整理导航、评论和日常使用的细节。 点击首页作者名可以进入关于页,评论只放在已发布的文章里,圆角和底部留白也统一了一遍。文章头部能看到字数和预计阅读时间,找不到页面时也有明确的返回入口。评论与导航 · 阅读时间
  • 让封面和内容概览更省心。 有封面的文章继续用原图,没有封面时,网页会把标题、摘要和分类排成一张文字封面。另外增加了可以折叠的 AI 摘要,哪些文章需要、摘要写什么,都由我在 Notion 中决定。
  • 把创作方式交代清楚。 经 AI 润色或由 AI 生成正文的文章,用标题旁的简短标签标记,点击后可以查看具体说明。摘要与正文的创作方式分开,读者可以按照自己的偏好选择阅读。文章标记与摘要

也给博客藏了一点小趣味

桌面端首页的头像里藏了一个刺猬生存小游戏。点击后,原本的个人介绍区域会展开成战场:控制刺猬移动、躲开敌人,攻击自动进行,升级时再从三个强化中选一个。
通关后,会解锁一套《NEW GAME!》主题,首页、文章、目录和评论区一起换成粉紫色的风格。解锁状态会保留,之后可以自由切换回平时的样子。
我挺喜欢这种藏起来的小趣味。平时安安静静地看文章,偶然点一下,又能发现一点意料之外的东西,也让这个博客更像是属于我自己的地方。
把想法一点点做成自己的博客
把想法一点点做成自己的博客

有想法,就可以试着做出来

以前改博客,很容易停在“这个地方要是能改一下就好了”。真正动手之前,得先弄清主题结构、组件关系,以及改完会不会影响其他页面。很多小想法还没开始,就被这些准备工作劝退了。
现在可以先把想要的效果描述出来,让 Codex 做一版,再打开预览继续调整。页面哪里太挤、哪些动效太抢眼、某张图片怎么又越界了,都可以直接指出来,接着改。连藏一个小游戏、做一套隐藏主题,也变成了可以顺手试试的事。
最终留下什么,还是要自己看、自己决定。不过,实现和反复修改的成本确实低了很多。搭起一个博客之后,继续把它改成自己喜欢的样子,也不再是那么费劲的一件事了。
Loading...