229
Free
Add to project

Product support

Get help in the plugin support forum.

  • Added on Mar 24, 2020
  • Current version: 1.0.2
  • Platform Compatibility
    v3.x not tested
    v2.x not tested
    v1.x use latest
  • Created by

Categories

In OctoberCMS backend, There is a way available to crop Media images via MediaManager Widget but the problem came-up when backend admin wants to crop other Normal/Gallery images (attachOne/attachMany).

Thanks to the Image Cropper plugin. This problem is solved now.

This plugin provides an Image Cropper Tool in Backend for Normal/Gallery images (attachOne/attachMany).

if you like the plugin then can you please provide a nice review? Thanks

How to install

  • Go to Image Cropper Plugin and add it to your project.
  • Or You can go to Backend > Settings and then go to install the plugin page and type Zakir.ImageCropper and install it.

How to configure

  • After installation, go to Backend > Settings and type Image Crop and click on IMAGE CROPPER link and then Enable Image Cropper.

How to crop an image

  • Now go to any image upload field and upload the image.
  • After uploading you will see a crop icon on the bottom/left on that image.
  • Click on that icon, it will open image in a pop-up, crop the image here and save it.
  • You can also customize the width/height for cropping via input fields.
  • You can see screenshots for all these steps.

How to call crop image on front-end

  • Suppose your image upload field name is player So in OctoberCMS, you normaly use below code for showing it.

    <img src="{{ model.player.path }}">

  • Now to show crop image, use this.

    <img src="{{ model.player|crop_image }}">

  • Found the plugin useful on 12 Aug, 2021

    Hello! Your plugin is great! But I have some problem with it -> When i click on icon for crop I catch error in JS " Uncaught TypeError: Cannot read property 'file_id' of undefined at getValue (imagecropper.js?Zakir.ImageCropper:57) at HTMLAnchorElement.<anonymous> (imagecropper.js?Zakir.ImageCropper:70) at HTMLAnchorElement.dispatch (jquery.min.js?v=c662da3f:2) at HTMLAnchorElement.v.handle (jquery.min.js?v=c662da3f:2) " Can you help me?

  • Found the plugin useful on 26 Mar, 2020

    Resolve a long time issue with october, seems to work fine. Must have plugin !

  • author

    Replied on 26 Mar, 2020

    Thanks for your nice feedback !!!

  • Please login to rate the plugin or write a review.
1.0.2

Created table zakir_imagecropper_cropper

Mar 24, 2020
1.0.1

First version of ImageCropper

Mar 24, 2020