嘿，来看看我的新博客 —— 从 WordPress 到 Astro

如果你最近打开过我的博客，应该已经发现，这个小破站换了一个新模样。花了几天时间，我将博客从用了四年的 WordPress 迁移到了 Astro，保留了原本的文章、评论和大部分功能及页面，也重新设计了博客的样式。

去年我还写过一篇《我的 WordPress 博客主题与插件设置分享》，介绍自己怎么用 Blocksy 主题和一堆插件拼出这个博客。现在回头看，没想到这么快又要写一篇改版记录了 😅。

不过，这次我依然没有自己编写一行代码。设计和迁移主要交给 Codex 完成，我负责提出需求、看效果，再把不满意的地方一遍遍改掉。正好借这篇文章，带大家逛逛新博客，也聊聊这次折腾的思路。

先来逛逛新博客

新的设计样式

我对旧博客其实一直挺满意：白色背景、蓝灰色文字，再配上自己做的文章封面，简洁，也有一点自己的辨识度。所以这次改版，我很早就确定了一件事：保持原来的配色和极简风格，适当调整博客样式，加入更多留白、圆角矩形和柔和阴影，尤其是顶部半透明的磨砂导航栏。页面依旧很干净，但不会显得过于单薄，也更有质感。

一些改变

1. 主页从以前按时间倒序罗列文章，改成了 5 个分区：「最新文章」展示最近的两篇文章，另外四个分类分区则更方便读者根据兴趣发现其他文章。而且，因为我的封面图片自带标题，所以直接省去了额外的标题文字，画面更加简洁直观。这是以前的 WordPress 博客使用 Blocksy 主题时不太方便实现的。

2. 新博客也加入了很多我喜欢的小设计，比如主页顶部的「Everything happens for the best」。停留一会儿，它会柔和地切换成最近一条「说说」，放在一个白色的思考气泡里，看上去像右边的我正在碎碎念。

3. 文章和页面的展开也加入了一些轻微的动效：页面内容逐渐出现，卡片在鼠标悬停时稍微浮起，菜单缓缓展开。观感更加柔和、自然，进入文章时也不会显得突兀。

4. 新增了「博文」页面。以前 WordPress 默认的文章归档页不太符合我的审美，所以一直没有启用。在 Astro 下，我可以完全按自己的想法设计这个页面，方便读者根据分类、标签快速筛选文章。

5. 「好东西」页面基本保留了以前的设计，但加入了类似手机桌面切换的动效，观感会更好一些。

6. 还有一个我很喜欢的小地方：404 页面。找不到网页时，会看到一只叼着网线跑路的小猫。我想以这种方式继续纪念我最爱的咪咪。

7. 最后，我也重新设计了之前的一个「彩蛋」页面，并加入了一点动画，希望能给「有缘人」更多惊喜。

至于其他未提及的改变，就留给大家去发掘吧，希望能给大家带来更好的阅读体验。

为什么要从 WordPress 换到 Astro

WordPress 陪我从 2022 年一路折腾到现在。刚开始搭博客时，我几乎什么都不会，它的可视化后台、主题和插件帮了很大的忙。安装一个主题，在设置里调调颜色、字体和布局，就能做出一个像样的网站，写文章也很方便。后来我想加「说说」、书影音和好物分享页，就陆续装上插件，或者借助 AI 做一个自己的插件。旧博客能变成我喜欢的样子，WordPress 的这套玩法确实功不可没。

但维护 WordPress 博客的时间一长，我也发现了它的一些不便之处：

1. WordPress 占用的 VPS 资源更多。为了让我这个小破站流畅运行，我选择了配备 2 GB 内存的 VPS。即使如此，内存占用也会达到 70%；切换到 Astro 后，内存占用直接降到了 45% 左右。

2. WordPress 迁移起来更麻烦。每次更换 VPS，我都需要备份 WordPress 文件和数据库，迁移过程中还可能因为配置不对而报错。对于我这种小白来说，每次迁移都是一次大工程。静态博客则只需要上传构建好的文件，比 WordPress 简单太多。

3. WordPress 有更多的安全风险。每天通过 Wordfence 插件，我都能看到成百上千条试图攻击博客的记录，常常担心哪一天会出现安全问题。换成 Astro 静态博客后，这方面的顾虑少了一些。

4. 在 AI 的帮助下，静态博客更容易实现我想要的效果。对于 AI 而言，设计静态博客，比为 WordPress 设计插件要容易不少。以前想实现某个效果，需要修改主题或制作新插件；现在只需要把需求告诉 AI，它就能直接在 Astro 上帮我实现，更加省事。

5. WordPress 略显臃肿。大多数情况下，Astro 网站运行起来比 WordPress 更快、更流畅，这也是静态博客的优势。

虽然我列举了一些 WordPress 的不便之处，但并非鼓励大家都放弃 WordPress、转向静态博客。以上都是基于我自己的需求和使用体验。对于刚接触博客或嫌麻烦的用户，我还是更推荐 WordPress。

另外，放弃 WordPress、选择静态博客，也有不少需要解决的问题：

1. 静态博客本身没有数据库，一些功能需要依赖其他服务。比如最重要的评论功能，我目前使用 Artalk 来实现，之前它只负责「说说」页面的评论。博文中的「点赞」记录功能，也需要依赖 Cloudflare Worker 和 D1。

2. 没有后台，写博文可能会变得更加麻烦。以前 WordPress 还有手机客户端，在某些情况下写博客比较方便。现在我需要在电脑上用 Markdown 写文章，再重新构建博客，将文件上传到 VPS，才能完成一次更新。

3. 没有 WordPress 的「媒体库」，更加依赖图床。

4. 没有 WordPress 那样丰富的插件生态，许多功能需要自己实现，对小白不够友好。

不写一行代码，这次我是怎么折腾的

完成这次博客迁移后，我发现，在 AI 的帮助下，这个过程并没有之前想象中那么困难。

简单分享一下我的整个迁移过程，希望对感兴趣的朋友有所帮助：

1. 先不动 WordPress，设计一个新博客的 Demo。我先在 SiteInspire 中寻找自己觉得好看的网站作为参考，再交给 Codex 设计一个新的静态博客首页 Demo，之后不断调整，直到满意为止。我最终参考的网站是 idle.space。

   提示词类似于：

   首页设计提示词

   https://veryjack.com 这是我现在的博客网站，我想重新设计一下。
   你可以使用 [@Browser](plugin://browser@openai-bundled) 浏览一下我现在的网页。设计简洁、清晰，但还不够现代和有质感。
   我想保留原网站的色系和简洁、现代的风格，重新设计布局，并加入一些质感和元素，比如玻璃效果、适当的动画、圆角、阴影等，可以参考苹果当下的设计风格。还可以参考这个网站的效果：https://idle.space/。可以使用 [@Browser](plugin://browser@openai-bundled) 访问查看。
   请基于我网站的内容，设计一个新的静态网站模板，放到 [Blog_new_design](Blog_new_design/) 中。

2. 确定使用什么架构：Astro、Hugo，或者其他方案。Hugo 比 Astro 更轻量，但考虑到后期还可能继续折腾，而 Astro 的可玩性更高，也更方便 AI 实现一些「花哨」的效果，所以我选择了 Astro。

3. 将 WordPress 文件和数据库备份到本地，先完成文章迁移和文章页的设计。不急于一步到位，先迁移最基础、也最重要的文章内容，「书影音」「说说」等页面和评论功能可以留到后面再做。WordPress 数据已经保存在本地，数据迁移就可以交给 Codex，让它读取备份并完成处理。

   参考提示词如下：

   文章迁移提示词

   1. 我打算逐步将博客内容从 WordPress 迁移到 Astro。
   2. [wordpress_blog](wordpress_blog/) 是我从服务器上备份的 WordPress 文件和数据库。
   3. [Blog_new_design](Blog_new_design/) 是我最终想实现的新博客设计，Astro 博客需要实现这套设计。
   4. 新博客的文件放在 [astro_blog](astro_blog/) 中。
   5. 第一阶段只需要完成博文迁移，暂时不用处理评论。
   6. 新博客目前只需要包含主页、博文、关于页面和搜索功能，菜单栏也需要相应调整。
   7. 对于你无法完成的操作，请告诉我，由我来执行。
   8. 现阶段的目标是将文章从 WordPress 迁移到 Astro，并让新博客采用刚刚制作的模板样式。
   9. 补充说明：部分图片上传到了 WordPress 媒体库，大部分图片则在我的图床中（pix.veryjack.com）。
   请帮我实现。

4. 将新博客部署到 beta.veryjack.com 进行测试。我选了一个新的二级域名作为测试域名，先看看实际效果。同时，开始配置 VPS 定时从 GitHub 仓库拉取更新，避免每次修改后都要手动上传所有文件。

5. 升级 Memos 和 Artalk 服务。后面要实现「说说」页面和评论功能，都依赖之前通过 Docker 部署的 Memos 和 Artalk，所以先要解决服务版本过老的问题。我将它们的数据和 Docker Compose 文件下载到本地，让 AI 根据现有版本告诉我该如何升级。由于服务运行在 VPS 上，这部分由 AI 一步步指导我操作。为了保险，我没有直接升级原服务，而是部署了两套新服务进行测试，确认没问题后再替换。

6. 完成「说说」和评论功能以外的其他页面。考虑到 Artalk 的配置与域名有关，为了避免数据出问题，我没有第一时间在 beta.veryjack.com 上接入评论，而是逐步完成「书影音」「好东西」「小伙伴」等页面的设计。这些功能之前都是通过 WordPress 插件实现的，备份里已经有插件的代码和相关数据，可以让 Codex 参考并复刻。新博客本身没有数据库，就改为用本地的 JSON 文件记录这些信息。

7. 迁移到主域名。其他页面和效果调整得差不多后，就可以将新博客部署到主域名了。在此之前，我使用搬瓦工的快照功能备份了迁移前的数据，如果后续出现问题，也能一键恢复。如果使用其他服务商的服务器，至少也要先备份 WordPress 文件和数据库。

8. 实现「说说」和评论功能。之前的「说说」页面也是通过插件实现的，所以让 AI 参考旧插件复刻页面比较简单。至于评论，Codex 会读取 WordPress 中的旧评论数据，生成可以导入 Artalk 的文件。我只需要在 Artalk 后台按照 AI 的提示操作，再让 Codex 将评论功能接入新博客即可。

至此，博客就基本完成了迁移。

整个迁移过程，我全程使用 Codex 的 GPT 5.6 / 6.0 / 6.1 Sol（High）来完成，没有遇到严重错误，时间和精力更多花在博客样式和动效的调整上，比如改一下字体大小、换一个动效、换一个颜色、加一点阴影等。

为了让设计风格保持统一，可以在完成新博客的大体设计后，将设计风格和规范整理成一份 design_guide.md，方便 AI 遵循。当然，这个文件也不用自己从头写，让 AI 整理，自己再微调即可。

另外，需要再次强调：迁移博客前，一定要备份数据！

最后

从以前借助 AI 做几个 WordPress 插件，到这次重新设计、迁移整个博客，作为一个技术小白，还是挺有成就感的。能把自己喜欢的样子一点点做出来，再让以前的文章和留言继续留在这里，这几天的折腾就没白费。

欢迎来新博客逛逛，看看文章、翻翻相册，或者在「说说」下面留个言。如果发现哪里显示不对，或者用着不太顺手，也欢迎告诉我，我再继续慢慢调整。