# 🚀 Laravel Image Cropper - Quick Start Guide Follow these steps to get the **Laravel Cropper (Takeone)** package installed and working in your project in less than 5 minutes. --- ## 🛠 Step 1: Add the Repository Open your project's `composer.json` and add the custom repository. This is necessary because the package is currently hosted on a private Gitea server. ```json "repositories": [ { "type": "vcs", "url": "https://git.innovator.bh/ghassan/laravel-image-cropper" } ] ``` --- ## 🛠 Step 2: Install the Package Run the following command. **Note:** We use `@dev` to bypass the stability check since the package is in development. ```bash composer require takeone/cropper:@dev ``` --- ## 🛠 Step 3: Link Storage Run this command to make your uploaded images accessible from the web: ```bash php artisan storage:link ``` --- ## 🛠 Step 4: Prepare Your Layout Add **Bootstrap 5**, **jQuery**, and `@stack('modals')` to your `resources/views/layouts/app.blade.php`: ```html My Laravel App
@yield('content')
@stack('modals') ``` --- ## 🛠 Step 5: Use the Component In any of your Blade views (e.g., `profile.blade.php`), simply add the component: ```html @extends('layouts.app') @section('content')

Update Profile Picture

Click the button below to upload and crop your photo.

@endsection ``` --- ## ✅ Step 6: Test It! 1. Open your browser to the page where you added the component. 2. Click **"Change Photo"**. 3. Select an image from your computer. 4. Use the **Zoom** and **Rotation** sliders to adjust. 5. Click **"Crop & Save Image"**. 6. Check your `public/storage/avatars/` folder to see the result! --- ## 💡 Pro Tips ### Displaying the Image ```html ``` ### Rectangular Cropping (Banners) ```html ``` --- **Happy Coding!** 🚀