继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

在Kratos灵活的使用火山引擎ImageX的动态水印

weixin_慕尼黑0251150
关注TA
已关注
手记 1
粉丝 0
获赞 0

Kratos是什么

Kratos 是一款专注于用户阅读体验的响应式 WordPress 主题,整体布局简洁大方,针对资源加载进行了大量优化。

about.png

php-%3E%3D7.0.0-bluewordpress-v5.8%20alpha%20tested-%234c1localized.svg badge?style=rounded kratos?color=%234c1

安装方法

  1. 下载最新发行版本的 [.zip 格式安装包] github.com/Vtrois/Kratos github 可以下载;

  2. 登录 WordPress 管理员后台,进入 外观 > 主题 页面,然后点击 添加 按钮;

  3. 进入添加主题页面之后,再点击 上传主题 按钮;

  4. 点击 选择文件, 找到下载的 .zip 格式安装包,然后点击 现在安装 按钮;

  5. 进入 外观 > 主题 页面,找到 Kratos 主题,然后点击 启用 即可。

启用火山引擎ImageX

火山引擎的ImageX在图像处理领域应该处于行业领先地位,是一套集成CDN+存储+数据处理的端到端解决方案,整体感觉越来越火,启用ImageX的好处不用多说,之所以启用ImageX 主要考虑如下几点:

成本方面的考量:

  • 针对中小企业提供按流量计费前提下10GB流量+10GB存储+20TB的图像处理额度来试用,中小企业完全够用;
  • 不收取https费用、不收取回存储的费用;

能力方面的考量:

  • 提供访问实时处理压缩,将图片统一转换成高压缩比的格式,访问速度提升80%+
  • 能够提供动态添加水印的能力,这也是我目前看好的一个不错的功能;
  • 提供比较便利的数据迁移功能;

动态水印之旅

我根据上面步骤安装好了主题,然后启用ImageX,启用其实比价简单,填入ak和sk,填入审核通过的域名和图片模板;

如图:
后台配置

模板特殊说明:

模板是通过 ImageX后台来获取的,因为我需要实现动态水印,所以,我通过ImageX服务来完成

我期望我在WordPress后台不增加水印,只有前台的网页增加;

我选择 ImageX---->模板设置----图文水印

image

最后选择,通过awebp 格式输出,这个格式其实看起来就是一个webp格式;毕竟这个格式相对比较普及一些,压缩率还比较高,无论什么格式的图片一律 webp转码;

最后看一下效果:

demo.ujne7.com/demo2/?p=33

image

大功告成!

说说可能遇到的坑

避坑1:这个主题如果和之前的主题冲突,需要将历史的图片进行上传或者迁移,如果在本地的话:我看了下火山引擎的官网也提供了[迁移工具],如果实在不想迁移或者在第三方存储资源,可以直接配置ImageX镜像回源,这样至少可以读取到数据;

避坑2:原图访问不到问题,配置完毕之后,需要申请一下开启原图访问,[提交工单]如下:

避坑3:插件冲突,在实际对接中可能会存在不同插件冲突,这个按需开启即可,或者临时将冲突的插件进行替换或者关闭;

对比评测:

素材地址 加载图片大小 加载图片速度 节省比例
demo.ujne7.com/demo2/wp-content/uploads/2021/06/6569.jpg_wh12001.jpg 246.252KB 500KB/S 0%
wpstatic.e7e7e7.com/2021/06/6569.jpg_wh1200.jpg~tplv-1upkr0djo9-imagexpingce.awebp 76KB 2MB/s 节省300%+

整体来看,Kratos 使用了火山引擎ImageX效果还是很明显的!

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP