定制 ibelieve/statamic-image-cropper 二次开发

按需修改功能、优化性能、对接业务系统,提供一站式技术支持

邮箱:yvsm@zunyunkeji.com | QQ:316430983 | 微信:yvsm316

ibelieve/statamic-image-cropper

最新稳定版本:v2.0.0

Composer 安装命令:

composer require ibelieve/statamic-image-cropper

包简介

Image cropping fieldtype for Statamic

README 文档

README

Packagist Downloads License Supported Statamic version

This addon adds an image cropping fieldtype, for those cases where focal point cropping just isn't enough. This project is a fork of tv2regionerne/statamic-image-cropper to add compatibility with Statamic 6, since as of March 2026 the original repo has not received any updates since June 2024 and is only compatible with Statamic 4 and 5.

Features

This fieldtype can be found under the "Media" category, and requires you to set Image Source Field and Dimensions.

If you rather want to do it YAML style, this is it:

handle: crops
field:
  type: image_cropper
  display: Crops
  show_details: true
  source: image
  dimensions:
    '16_9': 16/9
    '1_1': 1/1
    freeform: Freeform

How to Install

You can run the following command from your project root:

composer require ibelieve/statamic-image-cropper

How to Use

After setting up the fieldtype and have chosen an image, you get the option to select a dimension to crop:

Selecting a dimension will trigger the cropping overlay, and once you're happy with your crop you press Save:

In a template you can then use the crop as so:

<img src="{{ glide:image :crop="crops:16_9:crop" }}" />

This line of code means that you're applying a cropping action to your image. The part :crop="crops:16_9:crop" tells the system two main things:

  • crops is a reference (or "handle") to your specific Image Cropper setting. Remember, you should replace crops with whatever name you've given to your Image Cropper field.
  • 16_9 indicates the aspect ratio for the crop. In this case, it's set to 16:9, which is a common widescreen format. You can change this to any other ratio you need for your image.

Enjoy cropping away!

统计信息

  • 总下载量: 24
  • 月度下载量: 0
  • 日度下载量: 0
  • 收藏数: 2
  • 点击次数: 5
  • 依赖项目数: 0
  • 推荐数: 0

GitHub 信息

  • Stars: 2
  • Watchers: 1
  • Forks: 0
  • 开发语言: Vue

其他信息

  • 授权协议: MIT
  • 更新时间: 2026-03-05

承接程序开发

PHP开发

VUE

Vue开发

前端开发

小程序开发

公众号开发

系统定制

数据库设计

云部署

网站建设

安全加固