写在前面

Next主题里能加入赞助二维码还是很方便的，但有个缺点就是图太小，点击没有放大效果。

需要注意： 如果使用Github Action部署或者Cloudflare Pages的Import from Github部署的话，不能用npm install来安装主题。需要把主题文件放到themes文件夹里。

环境版本

1
2
3
hexo: 6.3.0

hexo-theme-next: 8.17.1

配置（非必须）

在Next的配置文件中配置显示赞助按钮和赞助二维码路径

1
2
3
4
5
6
7
8
reward_settings:
  enable: true                      #打开赞助按钮

reward:
  wechatpay: /images/wechat.jpg     #微信
  alipay: /images/alipay.jpg        #支付宝

fancybox: true                      #启用Fancybox

代码

themes\next\source\js\third-party\fancybox.js

1
2
document.querySelectorAll('.post-body :not(a) > img, .post-body > img').forEach(element => { 
//后面省略

在选择器这行，把赞助二维码加入fancybox的作用范围。

1
2
3
//, .post-reward img 加入这个选择器
document.querySelectorAll('.post-body :not(a) > img, .post-body > img, .post-reward img').forEach(element => { 
//后面省略