给picgo上传的图片加个水印

picgo,上传,图片,水印 · 浏览次数 : 76

小编点评

**解决方法:** 1. 在 Markdown 中上传图片时,添加自己的水印。 2. 在 PicGo 配置中设置图片水印路径和水印格式。 3. 选择支持的字体文件格式,例如 TTF。 4. 在图片上传之前,确保字体文件没有空格或其他特殊字符。 5. 如果无法成功添加水印,尝试更换字体文件或版本。

正文

之前给大家介绍了picgo和免费的图床神器。我们本可以开开心心的进行markdown写作了。

但是总是会有那么一些爬虫网站过来爬你的文章,还把你的文章标明是他们的原著。咋办呢?这里有一个好的办法就是把markdown中上传的图片加上自己的水印不就行了。

说干就干。接下来我会介绍如何在picgo中进行配置,给上传的图片加上水印。

picgo水印插件

当然要给picgo添加功能,第一首选就是去找找有没有对应的插件。

我们在picgo的插件设置中搜索:水印,然后点击。

很遗憾,你什么都找不到。那么是不是picgo没有水印插件呢?

当然不是。我们换个英文来搜索一下:watermark。 好了,一下出来了两个。

image-20240410135940772

那么我们到底应该装哪个呢?

别急,我们先点击两个插件的标题,会自动跳转到插件的主页。

他们的地址分别是: https://github.com/terwer/picgo-plugin-watermark-elechttps://github.com/fhyoga/picgo-plugin-watermark

经过对比,我们可以看到picgo-plugin-watermark-elec是从picgo-plugin-watermark fork过来的。原始的picgo-plugin-watermark已经有3年没有更新了。

基于:最新的就是最好的这一基本原则。我们就选择picgo-plugin-watermark-elec来使用吧。

回到PicGo中,我们点击安装,进行插件的安装。

安装需要点时间,我们多等一等。

安装好之后,我们进入他的配置页面:

image-20240410151428537

可以看到有字体文件路径,水印文字,水印文字颜色,字体大小,水印图片路径,水印位置和最小尺寸这几个选项需要填写。

  1. 字体文件路径。E.g./Users/fonts/Arial-Unicode-MS.ttf

​ 默认只支持英文水印,中文支持需要自行导入中文字体文件。

  1. 水印文字。E.g.hello world

  2. 水印文字的颜色,支持rgb和hex格式。E.g.rgb(178,178,178)#b2b2b2

  3. 字体大小,默认14

  4. 水印图片路径。E.g./Users/watermark.png,优先级大于文字

  5. 位置,默认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"
    }
    
  6. 原图最小尺寸,小于这一尺寸不添加水印。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)

好像是没有上传成功.

从错误看来是ttcf也就是我们的字体文件有问题。

直觉是因为我的字体文件带了空格。换一个没有空格的,或者把字体改个名字。

再试一次,还是不行.....

然后研究一下了字体文件。发现其实是有两种格式的,一种是TTF,一种是TTC。

我们换成TTF再试一下,这次成功啦。

image-20240410152432593

看看水印是不是出来了?

总结

好了,现在我们已经成功的给Picgo加上水印了。那么朋友们,大家能从这个故事中学到什么呢?

当然是遇到问题的解决方法啦!事实上,如果上面的尝试都不成功的话,我的下一步计划是把插件切换到最开始fork之前的版本再试试。

点我查看更多精彩内容:www.flydean.com

与给picgo上传的图片加个水印相似的内容:

给picgo上传的图片加个水印

之前给大家介绍了picgo和免费的图床神器。我们本可以开开心心的进行markdown写作了。 但是总是会有那么一些爬虫网站过来爬你的文章,还把你的文章标明是他们的原著。咋办呢?这里有一个好的办法就是把markdown中上传的图片加上自己的水印不就行了。 说干就干。接下来我会介绍如何在picgo中进行

给博客园的寄语

39岁大龄C#开发程序员,今天看到了博客园的求救信,内心不禁一阵触动,故而写下这一篇文章,以此来缅怀我和博客园一起走过的青春。 博客园虽然之前也发过几次求救了,但当时都觉得不至于吧,因为想着坚持这么多年用户基数不小的网站,再怎样维持生存应该不难吧。但这次看到了博客园团队为了运营不惜在借贷维持,我才觉

给博客园的几点现实建议

博客园又遇到了生存危机,老实说,意料之中。 因为,付费会员就能支撑一个完全免费的网站,这种商业模式还没成功过。 博客园的理念我完全理解,但是多听听现实性的建议才是正道。 第一计:祸水东引 博客园不接广告这种坚持我理解,但是,你就不能注册个小号? 比如注册个:hotspot.dev 开发热点网站,上面

给你安利一个程序员上岸公务员的开源项目

写在前面 也许你还在工位上焦虑着人工智能会不会替代自己 也许你还在为一眼看不到头的加班而苦恼 也许你还在为夜晚拉长了的背影而感到孤独无助。 那么今天推荐的这个开源项目或许值得你一看。 都说宇宙的尽头是考编,今天推荐的开源项目就是公务员从入门到上岸,最佳程序员公考实践教程。 一、项目简介 develo

给师妹写的《Java并发编程之线程池十八问》被表扬啦!

写在开头 之前给一个大四正在找工作的学妹发了自己总结的关于Java并发中线程池的面试题集,总共18题,将之取名为《Java并发编程之线程池十八问》,今天聊天时受了学妹的夸赞,心里很开心,毕竟自己整理的东西对别人起到了一点帮助,记录一下! Java并发编程之线程池十八问 经过之前的学习,我们知道在Ja

给程序员的10堂写作课(一)--30+的你,怎能错过写作?

你是否在职场打拼多年,却始终原地踏步,为升职无望而焦虑?你是否在风云变幻的环境中,整日提心吊胆,不知道何时会被裁员?你是否正步入 35+的行列,面临年龄危机,心生恐惧?如果你正被这些问题所困扰,又苦无对策,那么不妨尝试写作吧。

给大家分享一套非常棒的python机器学习课程

给大家分享一套非常棒的python机器学习课程——《AI小天才:让小学生轻松掌握机器学习》,2024年5月完结新课,提供配套的代码+笔记+软件包下载!学完本课程,可以轻松掌握机器学习的全面应用,复杂特征工程,数据回归,分类,算法的项目实战应用,以小学生的视角和知识储备即可学会。课程名字:AI小天才:

给公众号接入`FastWiki`智能AI知识库,让您的公众号加入智能行列

最近由于公众号用户太多,我就在思考有啥方式能给微信公众号的粉丝提供更多的更好的服务?这个时候我就想是否可以给公众号接入一下AI?让用户跟微信公众号对话,然后还能回到用户的问题,并且我提供一些资料让AI帮我回复用户的信息? 这个时候刚刚好我们的FastWiki项目满足了部分需求,然后我们就顺便加入了微

测试人员都是画画大神,让我看看谁还不会用代码图?

给大家30秒的时间,一起来思考这是什么? 这是某系统登陆模块功能的初始类图。 随着现代软件的不断复杂化,代码图(Code Graphs)为测试人员提供了一种直观的方法,让复杂的代码逻辑易于理解。本文将深入探讨代码图,通过挖掘到的真实场景和实际示例,展示可视化代码图如何增强软件测试人员的能力以及如何开

《一个程序猿的生命周期》-《发展篇》- 46.2000万预算的项目,为什么跟踪15个月失败了

给我们带来最直接的感受是:看似前景很美好,实质上却很卷。最应该反思和总结的是:尊重价值规律,在价值规律的原则下做事是否具备合理性,这是走的更远的基本保障,但是又很难做到。