总结
- 99.9% 情况下,只需用 1. GitHub Pages upload 模板的 MarkDown 的标准语法

- 要改尺寸或用 base64,用 2. Gmeek + Fancybox 引用代码(没必要)
- 要改居中,只能用 4. HTML 标签 - 三行 div(没必要)
- 仅用 base64,也可用 5. GJken 代码(没必要)
- 因为 GitHub Issues 有最大字符限制,页内添加一张几十K图片已经是极限,而且两种 base64 实现方式都没法使用 MarkDown 的引用语法,所以研究 base64 没意义
小细节
- 要是图片排版乱七八糟可以在每串图片代码前一行加个
#
强行分段 - 没必要太纠结居中和尺寸,小图才用得上居中,但不居中也没什么,而大图本来就居中
- img src 内直接加
align="center"
或align=center
企图实现居中在 GitHub Issues 或 Gmeek 都无效 - 可用 p 或类似字符如 abc 代替 div
- 尺寸定义可以是
width = "300" height = "300"
或width = "300"
或width = "50%"
任意一个 - HTML 标签 + base64 无效
1. GitHub Pages upload
优点:支持 Issues 预览,支持 Fancybox,推荐日常使用
缺点:不支持 base64 编码
自定义 | GitHub Issues | Gmeek |
---|---|---|
Fancybox | ❌ | ✅ |
base64 | ❌ | ❌ |
显示 | ✅ | ✅ |
位置 | ❌ | ❌ |
尺寸 | ❌ | ❌ |

2. Gmeek + Fancybox 引用代码
优点:目前自定义尺寸唯一方法,不用改代码直接支持含 base64 编码内的所有图片,推荐偶然用 base64 时使用
缺点:可能不支持懒加载插件(不能添加懒加载代码 ImgLazyLoad-circle
否则会失效),没法使用常规 MarkDown 引用语法,不过本来就最多只能添加一两张,所以没所谓懒加载,格式要额外记
自定义 | GitHub Issues | Gmeek |
---|---|---|
Fancybox | ❌ | ✅ |
base64 | ❌ | ✅ |
显示 | ❌ | ✅ |
位置 | ❌ | ❌ |
尺寸 | ❌ | ✅ |
`Gmeek-html<img data-fancybox="gallery" img src="URL" width = "300" height = "300" alt="name">`
3. HTML 标签 - 单行
优点:GitHub Issues 内比较完整支持
缺点:约等于 [description](url)
,格式麻烦,意义不大
自定义 | GitHub Issues | Gmeek |
---|---|---|
Fancybox | ❌ | ✅ |
base64 | ❌ | ❌ |
显示 | ✅ | ✅ |
位置 | ❌ | ❌ |
尺寸 | ✅ | ❌ |
<img src="URL" width = "300" height = "300" alt="name" >
4. HTML 标签 - 三行 div
优点:目前居中唯一方法,几乎全功能
缺点:格式用着比较麻烦,可惜 Gmeek 内不支持尺寸
自定义 | GitHub Issues | Gmeek |
---|---|---|
Fancybox | ❌ | ✅ |
base64 | ❌ | ❌ |
显示 | ✅ | ✅ |
位置 | ✅ | ✅ |
尺寸 | ✅ | ❌ |
<div align="center">
<img src="URL" width = "300" height = "300" alt="name" >
</div>
5. GJKen 代码
来源:Gmeek - 记录使用过程
原为改源码方式修改 Gmeek 仓库的 Gmeek.py 文件,通过下面这段代码激活
`Gmeek-imgbox="URL"`
现改为 js 格式并添加进外部加载的 fancyboxload.js 插件,并调整为通过更易记的和 GitHub Issues 相同的代码格式来激活
``
PS: 使用时 Image
不能改其它字符,前后的 ` 符号需保留,否则无效
现改成方便加载的 插件.js
解锁功能
优点:语法简单,兼容性好,支持含 base64 编码内的所有图片,可在需要 base64 时使用,但没太大意义
缺点:不支持 Issues 预览,要额外添加代码进插件,没法使用常规 MarkDown 引用语法,不过本来就最多只能添加一两张,所以没所谓懒加载,格式要额外记
自定义 | GitHub Issues | Gmeek |
---|---|---|
Fancybox | ❌ | ✅ |
base64 | ❌ | ✅ |
显示 | ❌ | ✅ |
位置 | ❌ | ❌ |
尺寸 | ❌ | ❌ |
``

6. Gmeek 自带格式(复杂情况使用)
优点:支持部分 HTML 语法 + base64,可变身为 2. Gmeek + Fancybox 引用代码
缺点:不支持 Issues 预览,不支持 Fancybox,格式不好记
自定义 | GitHub Issues | Gmeek |
---|---|---|
Fancybox | ❌ | ❌ |
base64 | ❌ | ✅ |
显示 | ❌ | ✅ |
位置 | ❌ | ❌ |
尺寸 | ❌ | ✅ |
`Gmeek-html<img src="URL" alt="name" width="50%">`
废案
废案1. Gmeek-html - 三行 div
没用,相当于 Gmeek-html 成为乱码 + 单行 HTML 标签,测试过放到 Gmeek-html 里面外面都一样
<div align="center">
`Gmeek-html<img src="URL" alt="" width = "300" height = "300" alt="name" >`
</div>
废案2. GitHub Issues + div
完全无效,都不显示图片
<div align="center">

</div>
废案3. GitHub Issues Original with =size
完全无效,都不显示图片

废案4. GitHub Issues Original with #pic_center
完全无效,都不显示图片

废案5. GitHub Issues Original with CSS
图片能显示但 CSS 后缀无效
{:height="50%" width="50%"}
废案6.# div + GJKen
完全无效
<div align="center">
`Image="https://github.com/user-attachments/assets/918d11b9-5864-429e-b7fe-1dffcb08a309"`
</div>
废案7. MarkDown 直接使用 base64(没法使用)
优点:可使用引用语法,将来用其它类型博客可参考使用
缺点:GitHub Issues 不支持
PS: Image 可以改为任意名称,顺便使用了引用方式作为示例
