關於博客文章圖片添加水印,網上差很少都是再說使用某某雲儲存,能夠有免費額度,雲儲存能夠對圖片進行添加水印。html
可是你須要考慮一點,若是博客網站越弄越大,圖文並茂愈來愈多,那麼你照樣須要掏錢。git
因此,一旦你讀了這篇文章,你將會擁有一個本地構建靜態網站時,就自動生成水印圖片。github
這是一個 Hexo
插件,它能夠爲你的文章圖片添加水印。shell
Demo-Centos7 安裝須要的軟件環境-使用rpm
安裝JDK
npm
插件地址-SpiritLing/hexo-images-watermarkapi
目前插件能夠直接在 hexo
官網 插件
上搜索到hexo
下面內容都是在插件的 README.md
上覆制過來的
目前個人正式版博客掛載在個人 Github
倉庫 blog
,能夠在個人倉庫直接訪問到插件svg
一款用於 Hexo 靜態博客網站生成時對圖片添加水印。post
不對原圖產生任何影響,在網站靜態頁構建過程當中將原圖讀取,輸出添加了水印的圖片。測試
在構建的靜態網站中不會存在原圖,只存在水印圖片。
必定要閱讀最後的提示事項,包含現有版本的支持狀況和即將添加的功能
使用 npm
安裝插件
npm install hexo-images-watermark
在站點配置文件 _config.yml
中進行以下配置:
watermark: enable: true textEnable: true rotate: -45 gravity: centre
在 hexo generate
運行時會自動爲你的 _post
目錄下的圖片添加水印,新的圖片將會放到 public
目錄中對應的位置。
enable
默認值:無
說明:true
將會執行圖片添加水印,false
將會不執行添加
textEnable
默認值:false
說明:是否使用文原本添加水印(❌警告:目前不支持文本和圖片同時添加水印)
imageEnable
默認值:false
說明:是否使用圖片來添加水印(❌警告:目前不支持文本和圖片同時添加水印)
text
默認值:使用配置文件中的url,一旦url不存在直接顯示做者名字(SpiritLing)
說明:當你使用的文字過長時,一旦轉爲圖片後大於待加水印的圖片尺寸,則會出現錯誤。
fontPath
默認值:undefined,使用 text-to-svg
自帶字體
說明:本身加載須要的字體,支持單個字體文件,不區分中英文;若是純中文,請只加載中文字體,例:須要加載 source/static/font/custom.ttf
字體直接將其寫入到配置文件中便可
color
默認值:rgb(169,169,167)
說明:顏色可使用 rgb,rgba,#xxxxxx以及red名字式的。⚠️只對text有效
gravity
默認值:southeast
說明:設置水印位置處於什麼方向,以 上北下南左東右西
來肯定
參數可用值:
類型 | 說明 | 備註 |
---|---|---|
centre | 中央 | 圖片正中間 |
north | 北 | 上方中間 |
west | 東 | 左邊中間 |
south | 南 | 下邊中間 |
east | 西 | 右邊中間 |
northwest | 東北 | 左上角 |
southwest | 東南 | 左下角 |
southeast | 西南 | 右下角 |
northeast | 西北 | 右上角 |
fontSize
默認值:18
說明:文本字體大小,⚠️只對text有效
watermarkImage
默認值:watermark.png
說明:水印圖片,放置在source文件根路徑的圖片名稱;⚠️大小不要超過任何一張文章中的圖片,不然會出錯,能夠搭配縮放進行使用
width
默認值:50
說明:對圖片進行縮放。⚠️只對image有效
height
默認值:50
說明:對圖片進行縮放。⚠️只對image有效
rotate
默認值:0
說明:旋轉角度,如45
表明逆時針45度,-45
表明順時針45度
background
默認值:transparent
說明:配合text和rotate使用,指的是文字轉成的圖片一旦旋轉會出現多餘空白,設置這些地方的顏色,通常透明色便可
*.jpg
,*.jpeg
,*.png
兩種格式圖片,而且只支持source/_posts
文件夾下的圖片,也就是文章本地圖片;同時也不支持遠程圖片*.jpg
,*.jpeg
,*.png
兩種格式圖片1.1.x
以上版本, 1.0.x
是進行Hexo api相關測試時使用的,版本雜亂無章,使用 1.0.x
版本出現任何問題,概不理會[x] 文字水印
[x] 圖片水印
[x] 位置
本文做者: SpiritLing
版權聲明: 本博客全部文章除特別聲明外,均採用 BY-NC-SA 4.0 許可協議。轉載請註明出處!
SpiritLing'Blog
首發地址
插件地址