hexo yilia添加相册功能

看了网上的那么多种方法,感觉还是这种方法的相册框架比较好看,而且json 还有时间显示,虽然在过程中有很多问题需要去调试,但还是在不断调试中实现了。
个人认为思路的确很重要的,有思路才能不断地去解决问题嘛,
1.首先要在主题那创建个photo目录
2.那图片存放到一个地方(例如github)用来做图片源
3.页面中的相册格式,有小图片,愿大图片之分


实现

  • 进入到你的博客目录下git bash执行
    1
    hexo new page "photos"



.在博客的source文件夹下建立一个photos文件夹
.将样式文件放到photos文件夹下github里面有样式文件

  • 修改ins.js里面的放图片地址
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var render = function render(res) {
    var ulTmpl = "";
    for (var j = 0, len2 = res.list.length; j < len2; j++) {
    var data = res.list[j].arr;
    var liTmpl = "";
    for (var i = 0, len = data.link.length; i < len; i++) {
    var minSrc = 'https://raw.githubusercontent.com/kayye/BlogBackup/master/min_photos/' + data.link[i];
    var src = 'https://raw.githubusercontent.com/kayye/BlogBackup/master/photos/' + data.link[i];
    var type = data.type[i];
    var target = src + (type === 'video' ? '.mp4' : '.jpg');
    src += '';

minSrc和src地址,分别是你放小图片,大图片的创库

  • 图形的处理python脚本
    还需要安装python工具教程
    blog根目录要有这几个脚本文件

    使用
    1
    python too.py

生成大图片小图片,并且自动上存到github上
若出现no module named PIL错误
出现这错误的原因是: PIL 模块找不到,PIL 模块已经过时了.
需要pip install pillow

  • 图片的格式要求

    最前面是日期,然后用进行分隔
    后面是图片的描述信息,注意不要包含
    和.符号

  • 最后就是
    进入到你博客目录, 执行 python tool.py(处理图片,上传图片,生成 json 文件)
    hexo clean (清理之前的 HTML 等)
    hexo g (生成 HTML 文件)
    hexo s (看看效果如何)
    最后部署到你的博客上.