PHPackages                             sawastacks/kropify-codeigniter - 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. sawastacks/kropify-codeigniter

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

sawastacks/kropify-codeigniter
==============================

Images Cropping Library for Codeigniter

v1.1.9(1y ago)037MITPHPPHP ^7.2 || ^8.0

Since Aug 26Pushed 1y ago1 watchersCompare

[ Source](https://github.com/sawastacks/kropify-codeigniter)[ Packagist](https://packagist.org/packages/sawastacks/kropify-codeigniter)[ Docs](https://github.com/sawastacks/kropify-codeigniter)[ RSS](/packages/sawastacks-kropify-codeigniter/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (4)DependenciesVersions (5)Used By (0)

[!['Kropify'](img/kropify.jpg)](img/kropify.jpg)

[![GitHub release](https://camo.githubusercontent.com/1ee747391ab31e0b53e2fa8d73ca5d37c38da0d02a1a93a3fa6d42eddb9a4cd9/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f762f72656c656173652f73617761737461636b732f6b726f706966792d636f646569676e69746572)](https://camo.githubusercontent.com/1ee747391ab31e0b53e2fa8d73ca5d37c38da0d02a1a93a3fa6d42eddb9a4cd9/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f762f72656c656173652f73617761737461636b732f6b726f706966792d636f646569676e69746572) [![GitHub code size in bytes](https://camo.githubusercontent.com/742862cb9d99f6dae755e7d7f183fc7108bbf7ad90fe7aedb6c0f15ecf122941/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c616e6775616765732f636f64652d73697a652f73617761737461636b732f6b726f706966792d636f646569676e69746572)](https://camo.githubusercontent.com/742862cb9d99f6dae755e7d7f183fc7108bbf7ad90fe7aedb6c0f15ecf122941/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c616e6775616765732f636f64652d73697a652f73617761737461636b732f6b726f706966792d636f646569676e69746572) [![Total Downloads](https://camo.githubusercontent.com/c7a24dce5f630003eb25e3838b0de62a355580c8bd942dfaa429e178d37fcfc0/68747470733a2f2f706f7365722e707567782e6f72672f73617761737461636b732f6b726f706966792d636f646569676e697465722f646f776e6c6f616473)](https://packagist.org/packages/sawastacks/kropify-codeigniter) [![Package License](https://camo.githubusercontent.com/1a2e0606685ce00663bf829868f794fd3fc9c86f8d80cae324734129e0723a58/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d4d49542d627269676874677265656e2e737667)](LICENSE) [![GitHub Org's stars](https://camo.githubusercontent.com/9700551dfa275efe08e6a5f9a2e41ec131a8f81794c69f510c41d4a2a18dfc1f/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f73617761737461636b732f6b726f706966792d636f646569676e697465723f7374796c653d736f6369616c)](https://camo.githubusercontent.com/9700551dfa275efe08e6a5f9a2e41ec131a8f81794c69f510c41d4a2a18dfc1f/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f73617761737461636b732f6b726f706966792d636f646569676e697465723f7374796c653d736f6369616c)

Kropify
=======

[](#kropify)

**Sawa Stacks** brought you easy cropping image tool for user profile picture, cover image, etc... that can be integrated into Codeigniter project.

> **NOTE:** **`Kropify`** cannot be integrated into CodeIgniter framework only. It has another php version that can be integrated into Laravel Framework and Core PHP projects.

 [ ![drawing](img/bmc.png) ](https://www.buymeacoffee.com/sawastacks)

What is a **Kropify**?
----------------------

[](#what-is-a-kropify)

A **Kropify** is a tool that can be integrated into `CodeIgniter framework` projects for the purpose of giving users easy way to crop their profile pictures and cover images. It uses [JQuery 3.x](https://releases.jquery.com/) library in it's functionality as dependency. That's why it is important to include JQuery library on current view file.

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

[](#requirements)

- PHP &gt;= 7.2
- [Composer](https://getcomposer.org/) is required
- CodeIgniter 4.x
- [JQuery 3.x](https://releases.jquery.com/)

Installation
============

[](#installation)

This package can be installed through `composer require`. Before install this, make sure that your are working with PHP &gt;= 7.2 in your system. Just run the following command in your cmd or terminal:

1. Install the package via Composer:

    ```
     composer require sawastacks/kropify-codeigniter
    ```
2. After **Kropify** package installed, you need to publish its css and js minified files in CodeIgniter public folder by running the following command in terminal:

    ```
     php spark publish:kropify-assets
    ```

### Updating Package

[](#updating-package)

When new **Kropify** version released and try to update the current package to the latest version, you will need to use `composer update` command:

```
 composer update sawastacks/kropify-codeigniter
```

After Kropify package updated, you need also to update its assets (**css** and **js** minified files) by running the following command in terminal:

```
 php spark publish:kropify-assets
```

Usage
-----

[](#usage)

This package uses **css** and **js** minified files, that is why you first need to include this package assets on your view php file. Call the following helper function inside **``** tag of your blade file to including Kropify css file on page.

```

 Page title

   ......
   ...

```

For **Kropify** Js file, you need to call the following helper function inside **``** tag but before closing **``** tag after including JQuery as shown in below example.

```
  ..........
   .....

```

### Package initialization

[](#package-initialization)

Suppose that you have an input file on your form for user profile picture:

```
 >

    Page Title

      *{ box-sizing: border-box; padding: 0; margin: 0;}
       body{ font-family: serif;  width: 100%; height: 100%; }
       .box{ display: flex;justify-content: center;align-items: center;flex-direction: column; margin-top: 20px; }
        .previewElement{ display: block;width: 120px;height: 120px;background: #ddd; }
        .previewElement img{ width: 100%; height:auto; }

    Kropify for CodeIgniter

        User profile

  ........
  ..........
  ...........

```

Routes
------

[](#routes)

```
$routes->post('/crop', 'TestController::cropImage',['as'=>'crop']);
```

When you want to initiate **Kropify** on that particular input file, you will use the following scripts.

```

    $('input#avatar').kropify({
        preview:'.preview',
        viewMode:1,
        aspectRatio:1,
        cancelButtonText:'Cancel',
        resetButtonText:'Reset',
        cropButtonText:'Crop & update',
        processURL:'',
        maxSize:2097152, //2M
        showLoader:true,
        animationClass:'headShake', //headShake, bounceIn, pulse
        success:function(data){
            console.log(data);
        },
        errors:function(error, text){
            console.log(text);
        },
     });

```

### Options

[](#options)

OptionDefaultDescription`viewMode`1You can set this value to (1,2 or 3). But you can not add this option if you are happy with the default value which is 1.`aspectRatio`1You can add your custom cropped image ratio. You can use fractional numbers and float numbers. **eg**: `16/4`, `10/32`, `0.25`, `2.25`, etc... Default value is 1.`preview`**required**This option is very required option. This is where you define the output element to preview the cropped image. Here, you must use jquery selector to select **id=""** or **class=""** of the img tag element where you want to display cropped image result.`cancelButtonText`CancelYou can change this button text with your need and according to your language.`resetButtonText`ResetYou can change this button text with your need and according to your language.`cropButtonText`CropYou can change this button text with your need and according to your language.`maxSize`2097152By default, this value set to the maximum size of **2MB** .But, you can set your own maximum size of selected image.`processURL`-This option is very required. You must define your url of croping selected image. eg: ***processURL : "`/crop`"*** or ***processURL : "``"***`showLoader`trueIf you want to display loading element when user croping the selected image, you can set this option to ***true***. But if you do not want that loading element appears on page, set this option to ***false***.`animationClass`pulseIf you want to animate cropping area, you may use this option by choosing one of three animation classes allowed `pulse`,`headShake`,`fadeIn` and `pulse`. By default, this value set to `pulse` class.### Errors callback

[](#errors-callback)

This callback has two arguments, `error` and `text`

```
 errors:function(error, text){
    console.log(text);
 }
```

ParameterDescription`error`This prameter will return two types of errors **invalidFileType** and **bigFileSize**. You can make a `if` condition according to the returned error type.`text`You can alert this value `eg`: alert(text);. If you are using Toastr.js plugin, You may use `toastr.error(text)'` function to display error alert.In controller
-------------

[](#in-controller)

To include **Kropify** class in controller is very simple. Just import the following lines on your controller.

```
 use SawaStacks\CodeIgniter\Kropify;
```

To upload the cropped image you will use the following lines inside method:

```
$request = \Config\Services::request();

 // Define path of image destination
 $path = 'images/users/';

//if you did not define name attribute on input file tag, the default name attribute value is "image". eg: $file = $request->file('image');
 $file = $request->file('avatar');

//Upload cropped image examples
 $upload = Kropify::getFile($file)->save($path); //This will give us random image name "5678cKs374hxdu5438vhsk83.png"
 $upload = Kropify::getFile($file,'avatar')->save($path); //This will geive us image name "avatar.png"
 $upload = Kropify::getFile($file,'avatar.jpg')->save($path); //This will geive us image name "avatar.jpg"
 $upload = Kropify::getFile($file,'avatar.dng')->save($path); //When you make a mistake on extension. This will give us image name "avatar.dng.png"
 $upload = Kropify::getFile($file,'avatar.png')->maxWoH(411)->save($path); //This will resize cropped image width or height to `411`

 //Return json
 $this->response->setJSON(['status'=>"OK",'message'=>'Your profile picture has been.']);

 echo json_encode(['status'=>"OK",'message'=>'Your profile picture has been.']);
```

The above lines will upload the cropped image in the specified path. The cropped image will be uploaded in CodeIgniter **public** folder Very important function on the chain is **`maxWoH()`**. This function will limit maximum dimensions (Width or Height) in px value of the uploaded image. If you do not need to compress and resize the cropped image, just do not add **`maxWoH()`** to the **Kropify** upload function chain.

### Get Cropped/Uploaded image details

[](#get-croppeduploaded-image-details)

When cropped image uploaded successfully, you can get the uploaded image information like name, size, width and height. You can use these details when you need to store them into database. Below are examples of getting uploaded image details:

```
$request = \Config\Services::request();
$path = 'images/users/';
$file = $request->file('avatar');
$upload = Kropify::getFile($file,'avatar.png')->maxWoH(710)->save($path);

//Get All details
$infos = Kropify::getInfo(); //option 1
$infos = $upload->getInfo(); //option 2

//According to the above options, you can get individual image info as follow:
$image_name = $infos->getName; // IMG_XH56.jpg
$image_size = $infos->getSize; // 13094
$image_width = $infos->getWidth; // 710
$image_height = $infos->getHeight; // 710

//You can also get individual image name, size, width and height after image uploaded without first getting all info as follow:

$image_name = $upload->getName(); //option 1
$image_name = Kropify::getName(); //option 2

$image_size = $upload->getSize(); //option 1
$image_size = Kropify::getSize(); //option 2

$image_width = $upload->getWidth(); //option 1
$image_width = Kropify::getWidth(); //option 2

$image_height = $upload->getHeigth(); //option 1
$image_height = Kropify::getHeigth(); //option 2

/**
 * According to the above guidance, use the following examples
 * to save cropped image data into database.
 */

 $student = new Student();
 $student->insert([
   'name'=>'John Doe',
   'picture'=>$infos->getName, //IMG_USER_982.jpg
 ]);

 //Return json data
 return $this->response->setJSON([
         'status'=>"OK",
         'message'=>'Your profile picture has been successfully updated.',
         'imageInfo'=>$infos
      ]);
```

Not Supported
-------------

[](#not-supported)

This package still in development, that is why you can not make two instances of this jquery plugin on single page.

Copyright and License
---------------------

[](#copyright-and-license)

This was written by [Sawa Stacks (sawastacks)](https://github.com/sawastacks) and is released under the [MIT License](https://github.com/sawastacks/kropify-codeigniter/blob/master/LICENSE).

Copyright (c) 2024 - Sawa Stacks

###  Health Score

27

—

LowBetter than 49% of packages

Maintenance37

Infrequent updates — may be unmaintained

Popularity7

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity47

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% 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 ~1 days

Total

4

Last Release

615d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/3c6b6769609859f5778760b8a9f959e9c3fb138f3a2b075c338dc641b18e3718?d=identicon)[sawastacks](/maintainers/sawastacks)

---

Top Contributors

[![sawastacks](https://avatars.githubusercontent.com/u/77852570?v=4)](https://github.com/sawastacks "sawastacks (16 commits)")

---

Tags

codeignitercropcodeigniter4CI4cropperkropify

### Embed Badge

![Health badge](/badges/sawastacks-kropify-codeigniter/health.svg)

```
[![Health](https://phpackages.com/badges/sawastacks-kropify-codeigniter/health.svg)](https://phpackages.com/packages/sawastacks-kropify-codeigniter)
```

###  Alternatives

[sybio/image-workshop

Powerful PHP class using GD library to work easily with images including layer notion (like Photoshop or GIMP)

860918.1k11](/packages/sybio-image-workshop)[jonom/focuspoint

Smarter automatic image cropping for Silverstripe

108645.6k49](/packages/jonom-focuspoint)[ctessier/nova-advanced-image-field

An advanced image field for Nova with cropping and resizing.

103548.4k1](/packages/ctessier-nova-advanced-image-field)[jbzoo/image

A PHP class that simplifies working with images

171126.9k3](/packages/jbzoo-image)[stefangabos/zebra_image

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

141110.4k5](/packages/stefangabos-zebra-image)[demi/cropper

Yii2 wrapper for Image Cropper javascript library

1328.7k1](/packages/demi-cropper)

PHPackages © 2026

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