[🛠] 如何在 GitHub Pages 博客中添加图片

✨ GPT 的摘要 　

关于如何在 GitHub Pages 博客中添加图片的指南。

我想给 GitHub Pages 博客添加图片，结果冒出了几个问题。

• 忘了具体该怎么做。

• 突然想起每个仓库好像有 1GB 容量限制。
  • 2025.1.13 修正
    • 1GB 是建议值，不是强制限制。
    • 超过 5GB 时，可能会收到邮件提醒。
    • 没有另外明确标注的总容量限制。
    • 单个文件大小限制为 100MB。（可以用 Git LFS 解决）
    • 仓库体积变大后，很可能会影响 clone/push 速度。
• 想起也可以使用外部图片托管。

… 在现在这个时代，到底怎么做比较好？

✨ 点击 ✨

以下内容是参考 GPT-4o 的回答写成的文章。

1. 常规方式：使用 assets/images 文件夹

把图片保存到博客项目内的 assets/images 文件夹，再连接对应链接。

示例

• 图片保存路径：

  assets/images/example.jpg
  

• 在文章中使用：

  ![图片说明](/assets/images/example.jpg)
  

这种方式很简单，但如果仓库容量接近 1GB 建议值，就可能出现问题。

---

2. 容量超出时的处理方法

1) 外部图片托管

不使用 GitHub 仓库，而是使用外部服务。

• Imgur：上传图片后使用 URL。

  ![图片说明](https://i.imgur.com/example.jpg)
  

• Google Photos/Dropbox：使用云存储链接。

---

2) 创建独立的图片仓库

创建一个只管理图片的独立 GitHub Pages 仓库。

1. 创建新仓库（例如：blog-images）。
2. 上传并 push 图片。

3. 使用图片链接：

   ![图片说明](https://username.github.io/blog-images/example.jpg)
   

---

3. 为 URL 变更提前设置

可以在 _config.yml 中设置默认图片路径，减少以后修改链接的负担。

1. 添加到 _config.yml：

   image_baseurl: "/assets/images"
   

2. 写文章时：

   ![图片说明](/example.jpg)
   

3. 如果之后更换图片仓库，只修改 image_baseurl：

   image_baseurl: "https://username.github.io/blog-images"
   

---

4. 结论

目前先把图片保存到 assets/images 文件夹中使用，容量成为问题时再引入外部托管或图片专用仓库。