效果图如下：

正文

要实现该功能，需要先在 博客园>管理>设置>申请js权限。

1、准备好自己的微信和支付宝付款二维码，图片修改bmp结尾的格式。如：zfb.bmp。（可以直接修改后缀）

2、进入自己的博客园，管理>文件>上传图片。（在博客园上传的文件可以使用 "https://files.cnblogs.com/files/‘自己的博客地址名’/‘文件名字’" 来进行访问）

3、复制下面的js代码。

 1 <script>
 2 window.tctipConfig = {
 3         //此处imagePrefix是打赏图片地址的前缀，你可以自己找一张图片上传到你的博客文件夹，记得将图片名修改为 tab_4.bmp，然后将前缀替换为你自己的博客路径
 4         imagePrefix: "https://files-cdn.cnblogs.com/files/woju/",
 5         //此处是该功能css文件所在位置前缀，你可以进入该链接将其下载下来上传到你自己的博客园文件夹，然后将其修改为你自己的，https://files-cdn.cnblogs.com/files/woju/myRewards.css。
 6         cssPrefix:     "https://files-cdn.cnblogs.com/files/woju",
 7         buttonImageId:  4, //这个是按钮图片切换，上方你可以上传多个图片命名为 tab_1.bmp、tab_2.bmp、tab_3.bmp......然后修改数字就可以切换图片
 8         buttonTip:  "dashang",
 9         list:{
10             alipay: {qrimg: "https://files-cdn.cnblogs.com/files/woju/zhifubao.bmp"},
11             weixin:{qrimg: "https://files-cdn.cnblogs.com/files/woju/weixinzf.bmp"},
12         }
13 };
14 </script>
15 <script src="https://files-cdn.cnblogs.com/files/woju/tctip.min.js"></script> //打赏的js文件

上方代码中的注释部分你可以选择按照提示修改，也可以使用我的。

4、修改js代码第10、11行图片链接。

1 alipay: {qrimg: "https://files.cnblogs.com/files/自己的博客地址名/支付宝图片的名子.bmp"},
2 weixin:{qrimg: "https://files.cnblogs.com/files/自己的博客地址名/微信图片的名字.bmp"},

注意：自己博客的地址名，可以进入管理--设置，下面的【Blog地址名】就是。

5、进入 管理>设置，下拉找到【页首Html代码】，把修改完的js代码粘贴到里面，保存就可以在你的博客查看是否添加成功了。