octobercms 图片裁剪插件
octobercms Widget 小部件#
小部件列表#
- 自定义图片裁剪插件
自定义图片裁剪插件使用场景#
有这样的一个场景,你要发布一个活动,而活动的封面图需要固定比例大小,而 octobercms 并没有提供这样的一个插件(提供的只是一个从后台获取图片并裁剪,上传到一个关联模型,并不是一个字段里),而目前遇到了这样的一个需求,实现出来,方便大家。
要求#
图片最后是上传到阿里云 oss 依赖 oc-plugin-oss
如何使用#
1 默认不裁剪#
image:
label: 封面图
type: Jc91715\Widget\FormWidgets\CustomFileUpload
2 启用裁剪,宽高比为 1#
image:
label: 封面图
type: Jc91715\Widget\FormWidgets\CustomFileUpload
ifCrop: 1
radio: 1
3 页面上多个使用需定义一些额外参数,这些额外参数是为了防止和其它引入的元素冲突#
image1:
label: 封面图2
type: Jc91715\Widget\FormWidgets\CustomFileUpload
ifCrop: 1
radio: 1
inputId: custom-input-src2
inputFileId: file-change2
imgId: img-src-temp2
cropId: crop-id2
在一个页面上引入多个,这四个参数依次递增即可
inputId: custom-input-src2
inputFileId: file-change2
imgId: img-src-temp2
cropId: crop-id2
本作品采用《CC 协议》,转载必须注明作者和本文链接
推荐文章: