octobercms 图片裁剪插件

octobercms Widget 小部件#

github

小部件列表#

  • 自定义图片裁剪插件

自定义图片裁剪插件使用场景#

有这样的一个场景,你要发布一个活动,而活动的封面图需要固定比例大小,而 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 协议》,转载必须注明作者和本文链接
Make everything simple instead of making difficulties as simple as possible
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。