对Markdown默认的图片显示效果不满意，尤其显示宽度小于高度的照片时，整个文章的排版显示不舒服；如果打算连续显示多张大小不一的图片，那效果更是糟糕的一塌糊涂。所以，加入一个第三方图片浏览是很有必要的！！

Github搜索找到了blueimp Gallery，star,fork比较高搜索结果排名第一。简单测试后，发现非常容易使用，并且效果不错！支持手机浏览！

项目地址：https://github.com/blueimp/Gallery#requirements

使用方法

非常简单，看项目README很快可以搞定，我使用的是Lightbox效果，配置步骤：

1. 把css,img,js目录copy到网站存储。

2. 网页头引入样式：

3. 将代码段落加入网页body中：

   
   

   
   

   
   

   
   ‹
   ›
   ×
   
   

   
   

4. 在body底部加入：

5. 上述代码后面加入script，处理点击事件：

6. 最后，创建图片列表即可（注意，最好使用大小相同的缩略图）

   
   
   
   
   
   
   
   
   
   
   

还有其它的样式和配置项可选，具体内容可参考项目README。

集成到Ghost

我采用了非常简单粗暴的方式，将2，3，4，5的代码直接加入到post.hbs、default.hbs等模版。在需要的地方添加图片列表代码即可。

快速添加图片列表代码(Mac环境)

利用ThisService，写了一个简单的自动生成代码的脚本做为服务，之后在KeyBoard设置中为该服务绑定快捷键。

只需要按一次快捷键，再修改图片链接即可。

欢迎提出更便捷的方法

缩略图

我使用七牛云存储做为图片空间，七牛的数据处理功能可以完美解决这一问题。只需创建一个图片样式，定义好剪裁方式、大小、图片质量、格式。最后，通过：

http://绑定域名/文件名称 + 分隔符 + 处理样式名
如：http://space.qiniudn.com/sample.jpg/style.com.jpg

的方式，即可得到缩略图。

效果展示