PHPackages                             steirico/kirby-plugin-image-crop-field - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Image & Media](/categories/media)
4. /
5. steirico/kirby-plugin-image-crop-field

ActiveKirby-plugin[Image & Media](/categories/media)

steirico/kirby-plugin-image-crop-field
======================================

A image cropping field for kirby.

2.0.5(4y ago)152.9k3[8 PRs](https://github.com/steirico/kirby-plugin-image-crop-field/pulls)MITPHP

Since Jun 10Pushed 3y ago2 watchersCompare

[ Source](https://github.com/steirico/kirby-plugin-image-crop-field)[ Packagist](https://packagist.org/packages/steirico/kirby-plugin-image-crop-field)[ RSS](/packages/steirico-kirby-plugin-image-crop-field/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (6)Dependencies (2)Versions (14)Used By (0)

Kirby Image Crop Field
======================

[](#kirby-image-crop-field)

This plugin provides a field for cropping images visually and very flexibly.

[![kirby-plugin-image-crop-field](https://user-images.githubusercontent.com/10421363/59161680-0b683280-8ae6-11e9-8bc4-5b9145f34387.gif)](https://user-images.githubusercontent.com/10421363/59161680-0b683280-8ae6-11e9-8bc4-5b9145f34387.gif)

The field is based on [vue-cropperjs](https://github.com/Agontuk/vue-cropperjs) and [gumlet/php-image-resize](https://github.com/gumlet/php-image-resize).

Installation
------------

[](#installation)

Use one of the alternatives below.

### Download

[](#download)

Download and copy this repository to `/site/plugins/kirby-plugin-image-crop-field.

### Git submodule

[](#git-submodule)

```
git submodule add https://github.com/steirico/kirby-plugin-image-crop-field.git site/plugins/kirby-plugin-image-crop-field

```

### Composer

[](#composer)

```
composer require steirico/kirby-plugin-image-crop-field

```

Usage
-----

[](#usage)

### File Blueprint Usage

[](#file-blueprint-usage)

The plugin defines the new field type `imagecrop` which can be used in [file blueprints](https://getkirby.com/docs/reference/panel/blueprints/file). Define an appropriate file blueprint for images and add the field as follow:

> `/site/blueprints/files/image.yml`:
>
> ```
> fields:
>   crop:
>     label: Image Crop
>     type: imagecrop
>     minSize:
>       width: 700
>       height: 250
>     targetSize:
>       width: 1400
>       height: 500
>     preserveAspectRatio: true
> ```

### Blueprint Options

[](#blueprint-options)

#### `minSize`

[](#minsize)

Defines the minimum allowed size of the area that can be cropped from the original image.

- `width`: Minimum allowed width, bigger or equal to `1`
- `height`: Minimum allowed height, bigger or equal to `1`

Defaults:

- `width`: `1`
- `height`: `1`

#### `targetSize`

[](#targetsize)

Target size of the image after it has been cropped. The resulting image will be scaled to `width` as defined by `targetSize.width` and `height` as defined by `targetSize.height`.

- `width`: Width of the target image, bigger or equal to `1`
- `height`: Minimum allowed height, bigger or equal to `1`

For both, `width` and `height`, negative values are interpreted as absolute values.

Defaults: The resulting image represents the cropped area and is not scaled.

#### `preserveAspectRatio`

[](#preserveaspectratio)

Whether to preserve the aspect ratio of the crop area as defined by `minSize.width / minSize.height` or to allow free cropping:

- `true`: Preserve aspect ratio
- `false`: Free cropping

Default: `false`

### Cropped Image in the Panel

[](#cropped-image-in-the-panel)

The plugin provides the [file method](https://getkirby.com/docs/reference/plugins/extensions/file-methods) called `croppedImage`. Applied as any other file method, `croppedImage` provides a `file` object of the cropped version of origin image.

The following configuration previews the cropped image in a `files sections`:

> `/site/blueprints/pages/album.yml`:
>
> ```
> title: Album
>
> sections:
>   images:
>     type: files
>     layout: cards
>     template: image
>     info: "{{ file.dimensions }}"
>     image:
>       ratio: 16/9
>       cover: false
>       query: file.croppedImage
>     min: 1
>     size: small
> ```

### Use Cropped Image in Templates and Snippets

[](#use-cropped-image-in-templates-and-snippets)

Use the the [file method](https://getkirby.com/docs/reference/plugins/extensions/file-methods) called `croppedImage` in order to work with the cropped image in templates and snippets:

> ```
>
>   image()->croppedImage() ?>
>
> ```

Issues
------

[](#issues)

Feel free to file an [issue](https://github.com/steirico/kirby-plugin-image-crop-field/issues) if you encounter any problems or unexpected behavior.

Currently there is a know issue that crooped images apear twice when geting images by `$page->images()`.

License
-------

[](#license)

MIT

Credits
-------

[](#credits)

- [Rico Steiner](https://github.com/steirico)
- [vue-cropperjs](https://github.com/Agontuk/vue-cropperjs)
- [gumlet/php-image-resize](https://github.com/gumlet/php-image-resize)

###  Health Score

35

—

LowBetter than 79% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity29

Limited adoption so far

Community13

Small or concentrated contributor base

Maturity66

Established project with proven stability

 Bus Factor1

Top contributor holds 86.4% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~175 days

Recently: every ~210 days

Total

6

Last Release

1653d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/4a97404f77dbf417cb426e8d40a454f558f6dd1094e943fec40823ba9ebc6430?d=identicon)[steirico](/maintainers/steirico)

---

Top Contributors

[![steirico](https://avatars.githubusercontent.com/u/10421363?v=4)](https://github.com/steirico "steirico (70 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (10 commits)")[![philipmarnef](https://avatars.githubusercontent.com/u/1675017?v=4)](https://github.com/philipmarnef "philipmarnef (1 commits)")

---

Tags

pluginimagefieldcropkirby3

### Embed Badge

![Health badge](/badges/steirico-kirby-plugin-image-crop-field/health.svg)

```
[![Health](https://phpackages.com/badges/steirico-kirby-plugin-image-crop-field/health.svg)](https://phpackages.com/packages/steirico-kirby-plugin-image-crop-field)
```

###  Alternatives

[stefangabos/zebra_image

A single-file, lightweight PHP library designed for efficient image manipulation featuring methods for modifying images and applying filters

141110.4k6](/packages/stefangabos-zebra-image)[reliqarts/laravel-guided-image

Simplified and ready image manipulation for Laravel via intervention image.

351.4k](/packages/reliqarts-laravel-guided-image)[ayvazyan10/nova-imagic

Imagic is a Laravel Nova field package that allows for image manipulation capabilities, such as cropping, resizing, quality adjustment, and WebP conversion. It utilizes the powerful Intervention Image class for image manipulation.

144.3k1](/packages/ayvazyan10-nova-imagic)[spescina/imgproxy

An image proxy for Laravel

201.3k](/packages/spescina-imgproxy)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)