如果你拥有hexo搭建的博客，然后使用也是Yilia主题的应该知道Yilia主题会有一个相册的。我也是使用的这一套主题，然后也很想搞一个相册，在Yilia主题的作者 Litten的github上留言问了如何实现这一个功能，作者也没有详细说明，我这里根据网友提供的方法来实现的。这里贴一下链接吧：点击这里可能更加详细。自己整理了一下思路：
- 在主页上必须有一个可供点击的相册链接
- 要用 hexo 生成一个 photos.html 文件
- photos.html 中的图片数据来源?因为这是一个静态页面所有要有一个 json 文件，其实就是ajax请求json文件来渲染的
- json 文件中有含有信息,图片的文件名.
- 图片要有一个完整的路径,把图片放到哪呢?七牛的图床,github 的空间,自己的服务器都可以.
- .怎么上传呢?大量图片当然写脚本传了.不会写咋办?很多人都写好了,改改就是了,脚本也有很多个版本.多数用 nodeJS写的,hexo 就用的 nodeJS.Python也是很不错的选择.
- 准备两套图片，一套大图(原图)，一套小图（缩率）
- 通过hexo d来生成相册页面
1. 提供一个可点击的链接。
1.进入你的博客目录下通过命令 hexo new page “photos”就会在source目录下生成photos这个文件夹
2.配置 Yilia 主题让其显示出来.
yourBlog/themes/yilia/_config.yml文件中这样设置
|
|
2. 如何生成一个photos.html这个文件
1.这里我也不知道具体如何生成，具体的代码我没有去看，因为我认为这仅仅是一个工具。所以我直接下载了作者的文件。下载地址，你也可以下载我的备份文件
2.这里就是放相册资源的目录，我是模仿作者的目录来的，具体的文件中怎么写可以直接参考Yilia主题的作者，我是直接拷贝下来的。说明一下:data.json这个文件开始是不存在。
ejs 文件是以后要hexo 文件渲染的文件.
assets 目录是放默认图片的也要有.
3.index.ejs文件可以修改也可以不修改，作者里是把评论的功能去掉了。而我把comments设置了true。
4.修改 ins.js 文件的 render()函数.这个函数是用来渲染数据的
修改图片的路径地址.minSrc 小图的路径. src 大图的路径.修改为自己的图片路径(七牛的, github的路径).
![此处输入图片的描述][4]
上面的代码只需要修改路劲就可以了。我在这里遇到一个坑，我下载了作者的代码，只修改了minSrc 和src这个路劲，但是最后发现缩略图没法显示，我在浏览器审查的时候发现，figure标签下的img标签的src路劲的地址不对，所我做了更改，直接把修改了minSrc.
3. 生成json文件
这一步是关键的一步,也是最后一步.先用脚本把图片处理成一套大图和一套小图,所以你需要在你的博客目录下准备如下图所示的文件
![此处输入图片的描述][5]
你把图片都放在这个文件之后执行python脚本后就会生成json文件的。然后把图片再上传的七牛或者 github 上
每次更新图片都要执行脚本重新生成 json 文件.这个json 文件会出现在
yourBlog/source/photos/data.json
图片如何命名，然后显示日期，这里可以看这位博主的点击查看
4. 处理图片
我用的别人写好的脚本,看他写得已经很全了,我也懒得再写了.改改就好了.[脚本下载地址][6]
.py 文件就是 Python 的脚本.
脚本的内容我就不讲了，因为我也不懂python语法，开始我下载下来然后执行的时候报错，折腾了很久才搞定的，要修改的地方就是：
- 173行的git_operation()方法，这个方法是把图片上传至github的，然如果你图片确实是放在github上，那就没必要注释掉。而我这里是放在七牛上的，所以用不到该方法。
大概131行这里，我执行脚本的时候报错了，源码上写的是../lawlite19.github.io/source/photos/data.json是对应到作者的博客的路径，这里根据需要改成自己博客的路径。而我这里更改成了本地 source/phontos。
最后就是执行脚本的功夫了5. 可能出现的问题（我是出现过的）
在命令行执行python too.py 命令的时候出现no module named PIL错误
百度后知道出现这错误的原因是: PIL 模块找不到,PIL 模块已经过时了.
解决方案: 安装 pip install pillow（cmd执行该命令就好了）
关于Python如何安装，建议谷歌或者百度。
6. 如何执行
cmd切换到你的博客目录下，然后执行 python tool.py(处理图片,上传图片,生成 json 文件)
hexo clean (清理之前的 HTML 等)
hexo g (生成 HTML 文件)
hexo s (看看效果如何)
最后部署到你的博客上.
网上大致文章都是这么的写,找到一个差不多就开始实践吧,如果你看我的去实践遇到问题可以找我,我只要有时间定会回复你.如果遇见更多的坑欢迎补充(github提问,博客评论, QQ 加好友都可以哦)✌️
