blog-博客美化-添加打賞按鈕

博客美化-添加打賞按鈕

1.獲取支付寶，微信的收款碼

1.1.獲取收款碼圖片

支付寶的使用說明
* 您也可以登錄支付寶，打開https://qr.alipay.com/paipai/personal.htm，保存網頁上的收款二維碼，然後將圖片添加到自己的博客園相冊裏面，然後將圖片的地址作爲qrimg參數傳入,這樣別人掃描此二維碼將直接使用支付寶快捷支付

微信使用說明
* 打開 微信->收付款>我要收款>長按二維碼圖片>保存到手機，將圖片裁剪後上傳到您的服務器，然後將圖片添加到自己的博客園相冊裏面，然後將圖片的地址作爲qqrimg參數傳入即可。

1.2.獲取收款碼鏈接地址

• 將圖片上傳到博客園的相冊中右鍵可以獲取圖片地址

https://images.cnblogs.com/cnblogs_com/tssc/1251319/o_tssc_alipay_2.jpg
https://images.cnblogs.com/cnblogs_com/tssc/1251319/o_tssc_wechat_2.png
https://images.cnblogs.com/cnblogs_com/tssc/1251319/o_201211123451tssc_wechat_zanshangma.png

2.博客園設置JS代碼

• 進入自己的博客園->設置，將以下JavaScript代碼添加到“頁腳Html代碼”

<!--打賞 Start-->
<script>
    window.tctipConfig = {
            staticPrefix: "https://static.tctip.com",
            buttonImageId: 1,
            buttonTip:    "dashang",
            list:{
                alipay: { qrimg: "https://images.cnblogs.com/cnblogs_com/tssc/1251319/o_tssc_alipay_2.jpg"},
                weixin: { qrimg: "https://images.cnblogs.com/cnblogs_com/tssc/1251319/o_tssc_wechat_2.png"},
            }
    };
</script>
<script src="https://static.tctip.com/js/tctip.min.js"> </script>
<!--打賞 End-->

開源插件地址：

https://github.com/greedying/tctip

參考地址：

https://www.cnblogs.com/jackson0714/p/BeautifyBlog_07.html
https://www.jianshu.com/p/16a8f15c543d

<iframe src="https://gitcdn.link/cdn/TinyJay/donate-page/faa9d69210d334af644f254296e1a8b3e24da3be/simple/index.html" style="overflow-x:hidden;overflow-y:hidden; border:0xp none #fff; min-height:240px; width:100%;"  frameborder="0" scrolling="no" allowtransparency="true"></iframe>