轻松搞定文章的封面图

easy-cover

以前使用 Wordpress 时,每次设置文章的特色图片我都会犯难。个人就一大老粗,什么设计、排版、拍照这些技能点数几乎为零。因此很多时候我就在 Unsplash 与 Pixabay 上找一些无版权的图片来用,过程那叫一个煎熬啊。

个性化 Dante 这个主题时,因为不想再为找封面图片而去烦恼了,我第一时间将文章头部显示图片的代码块给删除了。不曾想到头来还是不能逃脱这个命运,因为我发现一些社交媒体共享还是会用到封面图,例如 Facebook 的 Open Graph 和 Twitter 的 Card meta。因此,哪怕现在在自己博客上不展示封面图,更新文章时还是会为此而烦恼一阵子。

幸运的是前不久在 Github 上找到了 youngle316/cover-paint: 🖌️ cover create tool 这个开源项目,经过一番测试觉得非常好用,轻松满足我对 OG Image 这类社会媒体共享的所有需求。

该开源项目已经有段时间没有更新了,我根据自己的需求稍作修改了一下。

  1. 增加了一些变量,方便定义默认的文章标题、摘要、作者、头像;
  2. 增加 Dockerfile,构建 Docker 镜像来运行项目;
  3. 增加 Noto Serif SC 字体,设置中文标题时更为正整、美观;
  4. 修改封面样式(来自 @eallion )。

项目演示:

Cover Paint - 老麦

修改后的项目仓库地址:

laomaiorg/cover-paint: 🖌️ cover create tool

关于 Docker 部署

  1. 克隆项目:git clone https://github.com/laomaiorg/cover-paint.git
  2. 在项目根目录创建 .env.local 文件,格式参考 .env.example,除了必要的 NEXT_PUBLIC_UNSPLASH_CLIENT_ID="Unsplash Access Key",优先配置 NEXT_PUBLIC_AVATAR_IMAGE_URL="你的头像 URL 链接",从此不用每次都上传头像。
  3. 第一次运行或修改了代码需重新构建时使用 docker compose up -d --build