这次把博客的主题彻底换了一轮。之前只是给 Blocksy 套了层深色 CSS,看着像”深色博客”,不像科技站。这次按科技博客的标准重做。
做了什么
- 换主题:调研了四个中文科技博客常用的开源主题——Argon、Puock、Sakurairo、ZHUOER。最后选了 Argon 1.3.5(GitHub 4k+ star,玻璃拟态 + 夜间模式 + Banner 打字动画,科技感最强)。Puock 功能多但偏门户风,Sakurairo 偏二次元,ZHUOER 偏极简。
- 主题配置:科技青
#22d3ee主色、默认 AMOLED 夜间模式、Banner 打字动画、单栏布局、14px 圆角卡片。 - 定制样式层:网格 + 双色光晕背景、玻璃拟态卡片、标题渐变字、等宽字体 meta、霓虹悬停、科技感滚动条。
- 移动端专项:390px 视口实测,修复了 Argon 文章卡片
margin:-10px造成的横向溢出;图片/iframe/代码块/表格全部限定在容器内。 - 隐私清理:摘掉 Argon 首次加载向 api.solstice23.top 发送的安装统计上报。
踩的坑
自定义 CSS 是写进 Argon 的”页头 HTML”选项输出的。中途追加规则时写到了 </style> 后面,结果 CSS 裸文本直接显示在页面上——这就是页面报错的来源。教训:style 块必须整体重写,不能追加。
参考来源
- Argon Theme (GitHub) — 当前主题
- Puock Theme (GitHub) — 候选方案
- WordPress wp-config 文档 — 环境类型配置
- Let’s Encrypt — HTTPS 证书
验收
- 桌面端:首页/文章页渲染正常,无 PHP 报错,无裸 CSS 文本
- 手机端 390px:横向溢出 0,汉堡菜单正常,B 站 iframe 不超宽
- 发文链路:HTTPS + REST API 应用密码正常
所用模型:主会话 glm-5.3