本文作者:转载砖家

使用CDN图像处理实现图像水印和图片弹出兼容性

转载砖家 5个月前 ( 03-16 ) 4659
摘要: 使用一种特别的姿势来解锁 CDN 云储存也就是七牛,又拍,OSS 的更多关于图片的玩法,使得文章图片实现缩略图+水印+图片弹窗功能兼容并蓄。前言我不知道什么时候,有人问我一个问题:...

使用一种特别的姿势来解锁 CDN 云储存也就是七牛,又拍,OSS 的更多关于图片的玩法,使得文章图片实现缩略图+水印+图片弹窗功能兼容并蓄。

使用CDN图像处理实现图像水印和图片弹出兼容性 图像处理 jpg WordPress WordPress教程 WordPress优化 WordPress问题 WordPress插件 建站技术问题 博客 建站经验 WordPress WordPress教程 WordPress优化 WordPress问题 WordPress插件 建站技术问题 博客 建站经验 第1张

前言

我不知道什么时候,有人问我一个问题:由于缩略图可以直接由七头牛或其他牛使用,文章的图像水印是否也可以直接使用CDN的水印功能?我看到这个问题后开始尝试,但放弃了很长时间,主要是因为文章的图片样式会影响Git的图片弹出,因为Git的突破弹出使用了fancybox解决方案,我不知道其他什么是。这不是不相容的。后来,我发现百度似乎有类似的问题,所以我放弃了,但我最近遇到了图像样式,但它今天以一种非常奇怪的方式解决了。

解决办法

首先,这篇文章的首图就是开启了水印+缩略图的【本网站水印被我暂时去掉了,所以看不到,右下角的水印是截图工具自带的】,虽然目前我的水印被窝去掉了,但是不会影响看问题,我的图片链接后缀是加的!water.jpg,如果只看显示的图片的话,他的宽度应该只有 750px,但是地阿里之后图片尺寸确实 1920px 的,也就是说之前打开网页加载的是 750px 的图片,是原图的缩略图,如果看图片尺寸的话就更不一样,我想你们肯定明白了,我说的方法是什么了,就是将图片样式名字命名为【water.jpg】当然,你也可以是别的,比如 googlo.png,比如 happy.gif,总之让图片弹窗的插件认为这个本来就是原图。

使用CDN图像处理实现图像水印和图片弹出兼容性 图像处理 jpg WordPress WordPress教程 WordPress优化 WordPress问题 WordPress插件 建站技术问题 博客 建站经验 WordPress WordPress教程 WordPress优化 WordPress问题 WordPress插件 建站技术问题 博客 建站经验 第2张

实测:七牛,又拍,OSS 都支持这种图片样式命名方法

水印代码

其实这篇文章主要是想法,水印代码没关系,这里贴出来,这里是云端使用的水印代码,这里只要添加水印图片

  1. function git_cdn_water($content) {

  2.        global $post;

  3.        $pattern ="/<img(.*?)src=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>/i";

  4.        $replacement = '<img$1src=$2$3.$4!water.jpg$5$6>';//换成自己的图片样式名字

  5.        $content = preg_replace($pattern$replacement$content);

  6.        return $content;

  7. }

  8. add_filter('the_content', 'git_cdn_water');

可选版水印

上面的代码是为所有图像添加水印,但有时我们上传的照片不太好,不能加水印。在这里我们可以选择一个可以选择的版本,但是如果图像是水印的,我们必须保持图片弹出。如果您不想要水印,请不要播放窗口。事实上,这只是常规比赛的修改!

  1. function git_cdn_water($content) {

  2.        global $post;

  3.        $pattern ="/<a(.*?)href=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)><img(.*?)src=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>/i";

  4.        $replacement = '<a$1href=$2$3.$4!water.jpg$5$6><img$7src=$8$9.$10!water.jpg$11$12>';

  5.        $content = preg_replace($pattern$replacement$content);

  6.        return $content;

  7. }

  8. add_filter('the_content', 'git_cdn_water');

后语

在此之后,我想起了我经常听到的一句话:有时想法比技术更重要。

文章转载于乐趣公园:http://gitcafe.net/archives/6203.html


推荐阅读:

建行信用卡的标准是什么?花了多少年费?

支付宝集五福活动即将到来 将于1.25日正式开扫

微信收藏活动复活 新老用户百分百领取1元

文章投稿或转载声明:

来源:乐趣公园版权归原作者所有,转载请保留出处。本站文章发布于 5个月前 ( 03-16 )
温馨提示:文章内容系作者个人观点,不代表大发快3辅助_快3网页版_是真实吗|对其观点赞同或支持。