為部落格插入打賞功能
阿新 • • 發佈:2020-12-20
開通部落格的第一件事,自然是要改造自己的部落格頁面。思來想去的,糾結從哪方面開始改造比較好。。。
隨便逛了逛別人的部落格,發現這個打賞彈窗功能比較好玩,自己決定也整一個。雖然我也覺得不會有哪個大佬(chundan)會給我打賞。。。
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
第0步 開通 js許可權。
進入自己的部落格,滑鼠移動到自己頭像上,會出現賬號設定。
進入後點擊左側的部落格設定。
點選“設定”選項,向下拉。會看到部落格側邊欄公告(支援HTML程式碼)。
申請開通js許可權,只要理由合適,基本上都會給開通的。開通時間挺快的,我的也就20多分鐘就開通了。
第一步
準備好自己的支付寶收款碼和微信收款碼,字尾修改為.bmp格式。
第二步
進入自己的部落格,滑鼠移動到自己頭像上,會出現賬號設定。
進入後點擊左側的部落格設定。
點選檔案選項,選擇“瀏覽”,然後“上傳”。
上傳後會出現圖框3,點選檔名, 會出現如下圖片,分別複製好著兩個收款碼地址,下一步會用到。
第三步
回到第0步中的“設定”選項,在“頁首HTML程式碼“框中複製以下程式碼:
1 <script src="https://static.tctip.com/tctip-1.0.0.min.js"></script> 2 <script> 3 new tctip({ 4 top: '30%', 5 button: { 6 id: 6, 7 type: 'dashang', 8 }, 9 list: [ 10 {11 type: 'alipay', 12 qrImg: 'https://files-cdn.cnblogs.com/files/songlaiqiang/2.bmp' 13 }, { 14 type: 'wechat', 15 qrImg: 'https://files-cdn.cnblogs.com/files/songlaiqiang/1.bmp' 16 } 17 ] 18 }).init() 19 </script>
修改程式碼中標紅的部分,替換為自己兩個收款碼的地址。
第四步 儲存,然後回到自己的部落格。重新整理。
這樣就有一個屬於自己的收款碼啦~~~~~~~~~~~