之前我们介绍了PicGo和免费的图床神器，现在能够愉快地进行Markdown写作。
然而，有一些爬虫网站会爬取你的文章，并且标记它们为自己的原创内容。那该怎么办呢？一个好的方法是为Markdown中上传的图片添加自己的水印。
接下来，我将介绍如何在PicGo中配置并给上传的图片添加水印。
picgo水印插件
首先，要为PicGo添加功能，当然就得搜索相应的插件。
在PicGo的插件设置中搜索“水印”，然后点击搜索结果。
很遗憾，没有搜索到任何相关插件。那么是不是PicGo没有水印插件呢？
当然不是。将搜索词换成英文"watermark"，出现了两个结果。
那么我们要选择哪个呢？
别急，首先点击这两个插件的标题，会自动跳转到插件的主页。
它们的地址分别是：
https://github.com/terwer/picgo-plugin-watermark-elec
和
https://github.com/fhyoga/picgo-plugin-watermark
对比后，我们发现picgo-plugin-watermark-elec是从picgo-plugin-watermark fork过来的。而原始的picgo-plugin-watermark已经有三年没有更新了。
基于“最新的就是最好的”这一基本原则，我们选择使用picgo-plugin-watermark-elec。
回到PicGo中，我们点击安装，进行插件的安装。
安装需要一些时间，耐心等待。
安装完成后，进入插件的配置页面:
配置包括字体文件路径、水印文字、水印文字颜色、字体大小、水印图片路径、水印位置和最小尺寸等选项。
-
字体文件路径。E.g.
/Users/fonts/Arial-Unicode-MS.ttf
。默认只支持英文水印，中文支持需要自行导入中文字体文件。
水印文字。E.g.
hello world
水印文字的颜色，支持rgb和hex格式。E.g.
rgb(178,178,178)
、
#b2b2b2
字体大小，默认
14
水印图片路径。E.g.
/Users/watermark.png
，优先级大于文字。
位置，默认
rb
export enum PositionType {
lt = "left-top",
ct = "center-top",
rt = "right-top",
lm = "left-middle",
cm = "center-middle",
rm = "right-middle",
lb = "left-bottom",
cb = "center-bottom",
rb = "right-bottom"
}
原图最小尺寸，小于这一尺寸不添加水印。E.g.200*200。
高度或宽度任何一个小于限制，都会触发。
根据个人习惯设置这些属性。最好设置一个中文字体，这样可以添加中文水印。例如，如果使用Mac电脑，字体文件路径在：/System/Library/Fonts/下。
我选择的字体是：
/System/Library/Fonts/Hiragino Sans GB.ttc
如果有人问，颜色在哪里选？向大家推荐一个官方的颜色选择网站：
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_colors/Color_picker_tool
然而，在配置好后再次上传图片时，却发现一个严重的问题：图片上传居然失败了...
只好去检查一下日志：
[PicGo INFO] beforeTransformPlugins: watermark running
[PicGo INFO] [PicGo Server] get the request {"list":["/Users/test/Library/Application Support/typora-user-images/image-20240410252432593.png"]}
[PicGo INFO] [PicGo Server] upload files in list
[PicGo INFO] Before transform
[PicGo INFO] beforeTransformPlugins: watermark running
[PicGo INFO] [PicGo Server] upload result------Error Stack Begin------
Error: Unsupported OpenType signature ttcf
at parseBuffer (/Users/test/Library/Application Support/picgo/node_modules/opentype.js/src/opentype.js:204:15)
at Object.loadSync (/Users/test/Library/Application Support/picgo/node_modules/opentype.js/src/opentype.js:380:12)
at Function.Text2svg.loadSync (/Users/test/Library/Application Support/picgo/node_modules/text2svg/index.js:61:23)
at new Text2svg (/Users/test/Library/Application Support/picgo/node_modules/text2svg/index.js:18:23)
at Object.exports.generate (/Users/test/Library/Application Support/picgo/node_modules/logo.svg/lib/index.js:25:16)
at getSvg (/Users/test/Library/Application Support/picgo/node_modules/picgo-plugin-watermark-elec/lib/text2svg.js:34:22)
at Object.handle (/Users/test/Library/Application Support/picgo/node_modules/picgo-plugin-watermark-elec/lib/index.js:34:49)
at /Applications/PicGo.app/Contents/Resources/app.asar/node_modules/picgo/dist/index.cjs.js:1:20521
at Array.map (
)
at je.handlePlugins (/Applications/PicGo.app/Contents/Resources/app.asar/node_modules/picgo/dist/index.cjs.js:1:20455)
看起来似乎上传不成功。从错误信息判断，似乎是字体文件有问题导致的。也许是因为我的字体文件带了空格。换一个没有空格的、或者改个名字试试。
再试一次，仍然不行……
然后研究一下字体文件，发现其实有两种格式，一种是TTF，一种是TTC。我们换成TTF再试一下，这次成功了。
检查一下，水印是否添加成功？
总结
现在我们已经成功的给PicGo加上水印了。从这个故事中，我们能学到什么呢？当然是遇到问题时的解决方法了！如果上面的尝试都不成功，我的下一步计划是把插件切换到最开始fork之前的版本再试试。
欢迎阅读更多内容：
www.flydean.com
