hexo-next添加酷炫打赏二维码

通过第三方网站生成酷炫二维码

参考:http://muyunyun.cn/posts/f55182c5/#more
按照上述方法,将其合并时,出现不能很好地识别的问题,故舍合并二维码的方法。

方法如下:

  1. 分别获取支付宝和微信的授课码
  2. 第九工厂生成喜欢的类型。
    备注:第九工厂中大部分收费是9.9元,有少部分免费的,免费的不需要登录即可生成艺术二维码(很赞),注意可能生成的二维码不能被正确识别,建议生成后自己扫码测试。

修改配置文件

修改next主题配置文件:theme/next/_config.yml,添加打赏的配置信息。

1
2
3
reward_comment: 坚持原创技术分享,您的支持将鼓励我继续创作!
wechatpay: 图片链接或图片相对路径
alipay: 图片链接或图片相对路径

设置打赏字体不闪动

修改文件next/source/css/_common/components/post/post-reward.styl,注释其中的wechat:hoveralipay:hover,如下:

1
2
3
4
5
6
7
8
9
10
11
12
/* 注释文字闪动函数
#wechat:hover p{
animation: roll 0.1s infinite linear;
-webkit-animation: roll 0.1s infinite linear;
-moz-animation: roll 0.1s infinite linear;
}
#alipay:hover p{
animation: roll 0.1s infinite linear;
-webkit-animation: roll 0.1s infinite linear;
-moz-animation: roll 0.1s infinite linear;
}
*/

完成效果

pic

点开打赏后:
pic

个人觉得效果非常好,很不错,感谢@牧云云!

坚持原创技术分享,您的支持将鼓励我继续创作!
0%