告别匿名头像,用 CSS 与 JSON 动态替换 Gravatar 默认头像
本文介绍了如何解决评论区默认 Gravatar 头像导致大量匿名用户使用相同默认图标、破坏页面视觉一致性的问题。作者首先指出大部分评论系统基于 Gravatar 机制,但国内用户很少注册,导致评论区频繁出现蓝色背景的默认头像。最初的方案是利用 CSS 的 img[src=""] 属性选择器和 content: url() 声明直接替换头像地址,但发现 CSS 文件被浏览器或 CDN 缓存后无法即时更新,且随着无头像访客增多,维护成本极高。为此作者提出了更优雅的解决方案:将头像映射关系写成 JSON 格式,部署在 GitHub Pages 上,再通过自执行 JavaScript 脚本从服务器拉取该 JSON,动态生成 CSS 样式并注入页面头部,从而替换所有匹配的 Gravatar 头像。该方案不依赖特定评论系统,只要底层使用 Gravatar 机制均可适用。作者最终将此服务命名为“梁栋烨头像联盟”,并开放共享,同时鼓励读者自行搭建以完全掌控数据。文章还表示会为长期访客提供头像解析工单,帮助其获得专属视觉标识。
Butterfly 主题说说分离部署及 GitHub Actions 自动构建详解
本文介绍了作者如何优化网站部署与数据管理流程,实现 Butterfly 主题的说说页面与主网站完全分离。作者首先改造了 GitHub Actions 中原本为 Next.js 设计的模板,将其适配为 Hexo 构建流程,配置了缓存、并发控制与自动部署,使每次推送代码后自动完成依赖安装、静态文件生成并部署到 GitHub Pages。随后,作者用 Python 编写脚本,将本地 YAML 格式的说说数据转换为独立 JSON 文件,并修改说说页面的 Frontmatter 配置,使其远程加载该 JSON 数据,从而实现内容与主站分离管理。最后,作者解决了因仓库名称冲突导致的路径跳转问题,通过改用不重名的仓库成功部署。整个过程显著提升了版本管理效率,降低了维护成本。
Hexo 博客部署平台选哪个?四大平台优缺点对比
本文介绍了 Vercel、Cloudflare Pages、Netlify 和 GitHub Pages 四种静态网站部署平台。Vercel 部署 Hexo 简单快速,但默认域名国内被屏蔽,需购买域名;Cloudflare Pages 速度仅次于 Vercel,同样需要自定义域名;Netlify 默认域名国内可访问,无需购买域名;GitHub Pages 最简单但速度最慢,仅支持静态页面和 Jekyll,其他框架需配置 Actions,优点是其 github.io 域名国内可访问。文章最后给出推荐顺序:Vercel 为首选,其次 Cloudflare Pages,再次 Netlify,最后 GitHub Pages。




