题添加相册功能呢? 想实现这个功能的大致思路如下:
1- github操作: 在github上建立一个独立的仓库用于储存照片
具体创建过程请看我的另一篇文章:git/hexo 用法介绍
2- 博客操作:在博客根目录下的source目录下创建photos
文件夹(**注意不是yilia主题的source)**用于存放显示照片相关的文件,也可通过命令 hexo new page photos
创建
3- 配置相关文件。具体步骤如下:
具体实现步骤:
1、下载github材料
下载地址:https://github.com/Janche/Blog-Photo.git
直接进去他的github项目里fork, 也可以cd到一个新文件夹里利用 git clone https://github.com/Janche/Blog-Photo.git
进行fork
2、建立github仓库,并且关联本地文件夹
1- 在博客同级目录下创建空文件夹
在博客同级目录下创建空文件夹 photos
在此文件下创建photos
文件夹用于存放原始图像,创建min_photos
存放缩略图。
2- 将下载下来的文件夹中的python文件复制到photos文件夹下,该文件夹最终效果图如下:
3- 上传文件到github仓库:参考 上传文件到github仓库
3、接下来我们开始操作:
1- 把 blog_photos_copy
文件夹里的四个文件复制到source/photos文件夹中。
2- 修改ins.js
文件
文中minSrc是缩略图的路径,src是原图的路径,修改这两项为你自己的图像来源。
3- 将 assets
文件夹复制到博客目录下的source目录下
这个很重要,并且assets里面的东西不能修改,否则会导致缩略图显示不了。
4- 修改tool.py
文件(这里最关键)
修改之前复制到photos文件夹里的tool.py
文件。
这里需要注意的一点是:存放原图的文件夹photos里的图片必须遵循规则: 2019-10-10_照片名称.jpg
把红色圈出来的改成你的博客目录下/source/photos/
这一步的目的是生成**.json**文件渲染前端页面的,必须在你的博客目录下的photos文件夹下。
这里在写入json文件中出现 中文乱码的现象,将圈起来的改成:
with open("E:/blog/source/photos/data.json","w",encoding='utf-8') as fp:
json.dump(final_dict, fp ,ensure_ascii=False)
这样就不会出现中文乱码了!
5- 执行python文件
需要有python环境,python下载点这里
tool.py文件是一个python脚本,目的是裁剪压缩照片,自动生成缩略图,并且在博客目录下的/source/photos/
文件夹下生成data.json
文件,同时利用git
指令将文件夹里的东西上传到github仓库。可以在github仓库界面查看文件是否上传(我测试的用脚本上传没有成功),如果没有可以使用手动上传,方法前面我们也已经讲到了。
注意:每一次添加照片都要执行依次tool.py
脚本。