給自己的部落格園新增打賞(贊助)功能

2022-07-08 13:15:15 字數 1318 閱讀 4079

現在比較流行打賞功能,很多應用或者部落格都有自己的打賞功能,但是目前還沒有該功能,那麼如何給自己的部落格新增打賞功能呢?當然是越簡便越好了,然後就發現了乙個第三方打賞外掛程式,介紹給大家,使用上非常便捷。外掛程式叫tctip,大家可以在github(上獲取。外掛程式的原理其實也很簡單,通過js生成乙個右側的側邊欄,然後把自己的收款碼放進去就可以了。效果如下:

該外掛程式有兩個大版本,新版本使用上更加便捷,下面以為例,說一下新版本的使用方法,當然這也適用於你自建的部落格。

一、申請js許可權

使用js需要申請許可權,如果之前申請過就不需要了,如果是自建部落格的也可以略過這一步。

1、在「我的部落格」→管理→設定→「部落格側邊欄公告」的位置,顯示「支援js**」即可。

二、準備收款碼

三、新增外掛程式**

1、將下面**根據自己的需求做調整後,新增到「我的部落格」→管理→設定→頁首html**,儲存完重新整理頁面即可。

12
引數說明:

(1)top:即該側邊欄外掛程式距離右上方的百分比。

(2)button的id:定義按鈕的顏色,目前可選的如下:

(3)button的type:定義按鈕上的文字,目前可選的為,dashang=打賞、zanzhu=贊助。

四、效果如下

如果重新整理沒有顯示,可以開啟瀏覽器的控制台,看下是否有報錯資訊(踩過的坑都放在最後一段)。

五、更多自定義調整

注意!前方有坑:

1、目前引用資源需要支援https,外掛程式新版本的官方資源是ok的,老版本外掛程式用官方資源的,可能會有問題,需要自己上傳js來引用。

2、目前github的1.0.4版本樣式有點問題,側邊欄跑到左邊且變形,所以本文使用了1.0.3的版本。

總結:

2020-8-12 更新:

最近發現這個外掛程式載入不了了。經過檢查發現,是因為載入js的時候,自動新增了refer引數,導致js延遲載入。需要把第三步的指令碼從「頁首html**」移動到「頁尾html**」就可以了。

部落格園新增打賞功能

新增打賞功能 確保已經申請支援js 在設定中 上傳收款碼到伺服器 在部落格設定 檔案中上傳,上傳前將字尾改為bmp 新增 到相應的位置 部落格設定 設定中頁面定製 css green channel green channel green channel reward reward popup th...

部落格園 加打賞

github12 tctip是乙個js外掛程式,作用是在web網頁右側生成乙個打賞浮動窗 一般引入min版本,即引入tctip 版本號.min.js檔案 在當前專案中即dist tctip 1.0.4.min.js 您也可以直接使用我提供的靜態鏈結http s new tctip list init...

五個步驟為部落格園新增打賞功能

支付寶 收錢 儲存 2 上傳到 方法 我的部落格 管理 檔案 上傳檔案 如下圖所示,注意將步驟1中的的副檔名改為 bmp 3 向申請獲取js許可權 方法 我的部落格 管理 設定 獲取js許可權 如下圖所示 4 修改如下 doctype html html lang zh cn head meta c...