PHPackages                             takdw/nova-advanced-image-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 &amp; Media](/categories/media)
4. /
5. takdw/nova-advanced-image-field

ActiveLibrary[Image &amp; Media](/categories/media)

takdw/nova-advanced-image-field
===============================

An advanced image field for Nova with crop and resize.

v1.2.3(5y ago)07.4kMITVuePHP &gt;=7.1.0

Since Nov 26Pushed 5y agoCompare

[ Source](https://github.com/takdw/nova-advanced-image-field)[ Packagist](https://packagist.org/packages/takdw/nova-advanced-image-field)[ RSS](/packages/takdw-nova-advanced-image-field/feed)WikiDiscussions 1.x Synced yesterday

READMEChangelog (2)Dependencies (1)Versions (15)Used By (0)

Nova Advanced Image Field
=========================

[](#nova-advanced-image-field)

[![StyleCI](https://camo.githubusercontent.com/48cfb1eb819aed41377d4557d7b83031ffdc3c78dbbdf596de637aa3384b699e/68747470733a2f2f6769746875622e7374796c6563692e696f2f7265706f732f3135363039313137352f736869656c643f6272616e63683d312e78)](https://github.styleci.io/repos/156091175)[![Latest Version on Packagist](https://camo.githubusercontent.com/fc854f776e1360df301a3ac02658cbcd3f319acd17bb25d7b3a50e416a1d5105/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f63746573736965722f6e6f76612d616476616e6365642d696d6167652d6669656c642e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/ctessier/nova-advanced-image-field)[![Total Downloads](https://camo.githubusercontent.com/9f91129313d676f84eea05da296ffbbd77f64d109e872159179f99259f16ba57/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f646d2f63746573736965722f6e6f76612d616476616e6365642d696d6167652d6669656c642e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/ctessier/nova-advanced-image-field)[![License](https://camo.githubusercontent.com/09855724cf1d5a04473a7a51498f616aa3efc6f82273a702edc3e7c1f5fbbfc3/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f63746573736965722f6e6f76612d616476616e6365642d696d6167652d6669656c643f636f6c6f723d253233423238373842267374796c653d666c61742d737175617265)](https://packagist.org/packages/ctessier/nova-advanced-image-field)

This package provides an advanced image field for Nova resources allowing you to upload, crop and resize any image.

It uses [Cropper.js](https://fengyuanchen.github.io/cropperjs) with [vue-cropperjs](https://github.com/Agontuk/vue-cropperjs) in the frontend and [Intervention Image](http://image.intervention.io) in the backend.

[![screenshot of the advanced image field](https://github.com/ctessier/nova-advanced-image-field/raw/1.x/screenshot.png?raw=true)](https://github.com/ctessier/nova-advanced-image-field/blob/1.x/screenshot.png?raw=true)

Requirements
------------

[](#requirements)

To work correctly, this package requires the following components:

- Laravel &amp; Nova (2 or 3)
- Fileinfo Extension

And **one of** the following libraries:

- GD Library &gt;=2.0 (used by default)
- Imagick PHP extension &gt;=6.5.7

See [Intervention requirements](http://image.intervention.io/getting_started/installation) for more details.

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

[](#installation)

Install the package into a Laravel application with Nova using Composer:

```
composer require ctessier/nova-advanced-image-field
```

If you want to use Imagick as the default image processing library, follow the [Intervention documentation for Laravel](http://image.intervention.io/getting_started/installation#laravel). This will provide you with a new configuration file where you can specify the driver you want.

Usage
-----

[](#usage)

`AdvancedImage` extends from `Image` so you can use any methods that `Image` implements. See the documentation [here](https://nova.laravel.com/docs/3.0/resources/file-fields.html).

```
