PHPackages riwash/simple-file-manager - 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. [File & Storage](/categories/file-storage) 4. / 5. riwash/simple-file-manager ActiveLibrary[File & Storage](/categories/file-storage) riwash/simple-file-manager ========================== A simple file manager for Laravel integrated with CKEditor 00Blade Since Apr 21Pushed 1mo agoCompare [ Source](https://github.com/riwash/Laravel-Simple-Filemanager-by-riwash)[ Packagist](https://packagist.org/packages/riwash/simple-file-manager)[ RSS](/packages/riwash-simple-file-manager/feed)WikiDiscussions master Synced 1w ago READMEChangelogDependenciesVersions (1)Used By (0) Simple File Manager for Laravel | File Uploader & Picker ============================================================ [](#simple-file-manager-for-laravel--file-uploader--picker) [![PHP Version](https://camo.githubusercontent.com/854124dd57cfd3aad3184fca9760bf1f33a5ec1e5d080cfbe8aa4e3337ba46e6/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f7068702d253345253344382e302d3838393242462e737667)](https://php.net/)[![Laravel Version](https://camo.githubusercontent.com/9d813782689be2a84a9ebeeff95243546a0bb745c17f86cf954294fcd6ce6e63/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c61726176656c2d253545372e30253230253743253545382e30253230253743253545392e3025323025374325354531302e3025323025374325354531312e3025323025374325354531322e302d4646324432302e737667)](https://laravel.com/)[![License](https://camo.githubusercontent.com/074b89bca64d3edc93a1db6c7e3b1636b874540ba91d66367c0e5e354c56d0ea/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d627269676874677265656e2e737667)](LICENSE) **Keywords:** Laravel File Manager, File Uploader, File Picker, CKEditor File Browser, Media Manager, Image Upload, Laravel Package A lightweight, easy-to-use file manager package for Laravel applications with built-in CKEditor integration and popup file picker. Features -------- [](#features) - **File Upload & Management** - Upload, view, edit, and delete files - **File Picker with Popup** - Built-in file picker that opens in a popup for easy file selection - **CKEditor Integration** - Built-in support for CKEditor file browser - **Multiple Storage Drivers** - Supports local storage and AWS S3 - **Blade Component** - Reusable file upload component with integrated file picker - **Custom File Picker** - Build your own file picker using postMessage API - **Search Functionality** - Search files by title - **Responsive UI** - Clean, modern interface - **Pagination** - Handles large file collections efficiently Installation ------------ [](#installation) Install the package via Composer: ``` composer require riwash/simple-file-manager ``` Setup ----- [](#setup) ### 1. Publish Assets [](#1-publish-assets) Publish the configuration, views, and public assets: ``` php artisan vendor:publish --tag=simple-file-manager ``` This will publish: - Configuration to `config/riwashfilemanager.php` - Views to `resources/views/vendor/simple-file-manager` - Assets to `public/vendor/simple-file-manager` ### 2. Run Migrations [](#2-run-migrations) Run the migrations to create the file manager database table: ``` php artisan migrate ``` ### 3. Configure Storage (Optional) [](#3-configure-storage-optional) For local storage, ensure the storage link exists: ``` php artisan storage:link ``` For AWS S3, configure your credentials in `config/filesystems.php` and set the `FILE_UPLOAD_TYPE` environment variable. Configuration ------------- [](#configuration) The configuration file `config/riwashfilemanager.php` contains: ``` return [ 'default' => env('FILE_UPLOAD_TYPE', 'local'), // local, aws 'prefix' => 'file-manager', // route prefix 'middleware' => ['web'], // route middleware ]; ``` Add to your `.env` file: ``` # Storage type: local or aws FILE_UPLOAD_TYPE=local ``` Usage ----- [](#usage) ### Access the File Manager [](#access-the-file-manager) After installation, visit the file manager at: ``` http://your-app.com/file-manager ``` Available routes: - `GET /file-manager` - File manager dashboard - `GET /file-manager/files` - File browser (for CKEditor/popups) - `GET /file-manager/demo` - Demo page ### Blade Component (FileUploader) [](#blade-component-fileuploader) The package includes a `FileUploader` Blade component (`Riwash\SimpleFileManager\Components\FileUploader`) for easy file selection with integrated file picker popup. **Component Class:** `Riwash\SimpleFileManager\Components\FileUploader` **Component Properties:** PropertyTypeDefaultDescription`name`string`image_url`Input field name attribute`id`stringauto-generatedInput field ID (auto-generated as `file-upload-{random}` if not provided)`placeholder`string`Select file`Placeholder text for the input field`previewWidth`string`200px`Width of the image preview (CSS value)**Basic Usage:** ``` ``` **Advanced Usage with All Parameters:** ``` ``` **The component automatically:** - Generates a unique ID if not provided - Creates a text input field with the specified name and placeholder - Adds a "Select File" button that opens the file manager popup - Displays an image preview next to the input when a file is selected - Uses `postMessage` API for communication between popup and parent window **Programmatic Usage:** You can also use the component class directly in your PHP code: ``` use Riwash\SimpleFileManager\Components\FileUploader; $component = new FileUploader( name: 'cover_image', id: 'cover-image-input', placeholder: 'Select cover image', previewWidth: '300px' ); return $component->render(); ``` ### CKEditor Integration [](#ckeditor-integration) To integrate with CKEditor, use the built-in JavaScript: ``` CKEDITOR.replace('editor1', { filebrowserBrowseUrl: '{{ route('file-manager.files') }}', filebrowserUploadUrl: '{{ route('file-manager.upload') }}?_token={{ csrf_token() }}' }); ``` ### File Picker (Component with Popup) [](#file-picker-component-with-popup) The Blade component includes a built-in file picker that opens the file manager in a popup: ``` ``` **How it works:** - Clicking the "Select File" button opens the file manager in a popup window - When a file is selected, the URL is automatically populated in the input field - An image preview appears next to the input (for image files) - The component uses `postMessage` for enhanced integration ### Custom File Picker [](#custom-file-picker) Create your own file picker implementation: **1. HTML Structure** ``` Browse ``` **2. JavaScript Function** ``` function openCustomFileManager(inputId) { window.open( "{{ route('file-manager.files') }}?input=" + inputId, "FileManager", "width=900,height=600" ); } // Listen for file selection (optional enhancement) window.addEventListener('message', function(event) { if (event.data.type === 'file-selected') { console.log('File selected:', event.data.fileUrl); // Custom logic here } }); ``` **3. File Selection Callbacks** The file manager supports multiple callback methods: - **Input Field Population**: Automatically fills the input with the selected file URL - **Image Preview**: Updates the preview image (if element ID matches `preview-{inputId}`) - **postMessage**: Sends a message event to the parent window for custom handling - **CKEditor Integration**: Works with CKEditor's file browser callbacks **4. Advanced Custom Picker Example** ``` Browse function pickFile(inputId) { const popup = window.open( "{{ route('file-manager.files') }}?input=" + inputId, "FilePicker", "width=1000,height=700,scrollbars=yes" ); // Optional: focus the popup if (popup) popup.focus(); } // Handle file selection via postMessage window.addEventListener('message', function(e) { if (e.data.type === 'file-selected' && e.data.inputId === 'thumbnail') { // Show file info document.getElementById('thumbnail-info').style.display = 'block'; document.getElementById('thumbnail-info').querySelector('.file-name').textContent = e.data.fileUrl.split('/').pop(); } }); ``` ### Customizing Views [](#customizing-views) After publishing, you can customize the views in: ``` resources/views/vendor/simple-file-manager/ ├── index.blade.php # Main file manager ├── files.blade.php # File browser for CKEditor ├── demo.blade.php # Demo page └── fileupload.blade.php # File upload component ``` AWS S3 Configuration -------------------- [](#aws-s3-configuration) To use AWS S3 for file storage: 1. Install the AWS SDK: ``` composer require league/flysystem-aws-s3-v3 ``` 2. Configure S3 in `config/filesystems.php`: ``` 's3' => [ 'driver' => 's3', 'key' => env('AWS_ACCESS_KEY_ID'), 'secret' => env('AWS_SECRET_ACCESS_KEY'), 'region' => env('AWS_DEFAULT_REGION'), 'bucket' => env('AWS_BUCKET'), 'url' => env('AWS_URL'), 'endpoint' => env('AWS_ENDPOINT'), 'use_path_style_endpoint' => env('AWS_USE_PATH_STYLE_ENDPOINT', false), ], ``` 3. Set the environment variable: ``` FILE_UPLOAD_TYPE=aws ``` File Model ---------- [](#file-model) Access uploaded files programmatically: ``` use Riwash\SimpleFileManager\Models\RiwashFilemanager; // Get all files $files = RiwashFilemanager::all(); // Search files $files = RiwashFilemanager::where('title', 'like', '%search%')->get(); // Create new file record $file = RiwashFilemanager::create([ 'title' => 'My File', 'filename' => 'original.jpg', 'path' => 'file-manager/abc123.jpg', 'url' => 'https://example.com/storage/file-manager/abc123.jpg', 'mime_type' => 'image/jpeg', 'size' => 1024000, ]); ``` Routes ------ [](#routes) MethodURINameDescriptionGET`/file-manager``file-manager.index`Main file managerGET`/file-manager/files``file-manager.files`File browser viewPOST`/file-manager/upload``file-manager.upload`Upload filePUT`/file-manager/edit``file-manager.edit`Update file titleDELETE`/file-manager/delete/{id}``file-manager.destroy`Delete fileGET`/file-manager/demo``file-manager.demo`Demo pageSecurity -------- [](#security) - File uploads are validated (max 10MB by default) - Routes use configurable middleware (default: `web`) - Files are stored with unique random filenames (12 characters) - Original file extensions are preserved Requirements ------------ [](#requirements) - PHP >= 8.0 - Laravel ^7.0 || ^8.0 || ^9.0 || ^10.0 || ^11.0 || ^12.0 License ------- [](#license) This package is open-source software licensed under the [MIT License](LICENSE). Credits ------- [](#credits) - **Author:** Riwash Chamlagain () Support ------- [](#support) For issues and feature requests, please use the [GitHub issue tracker](https://github.com/riwash/simple-file-manager/issues). ### Health Score 19 — LowBetter than 10% of packages Maintenance59 Moderate activity, may be stable Popularity0 Limited adoption so far Community6 Small or concentrated contributor base Maturity11 Early-stage or recently created project 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. ### Community Maintainers ![](https://www.gravatar.com/avatar/f76ba26fdea4d3b2980221dec18306aa528c2223bb8ba6e2588e6de5e1bd6737?d=identicon)[Riwash Chamlagain](/maintainers/Riwash%20Chamlagain) --- Top Contributors [![riwash](https://avatars.githubusercontent.com/u/48515504?v=4)](https://github.com/riwash "riwash (4 commits)") ### Embed Badge ![Health badge](/badges/riwash-simple-file-manager/health.svg) ``` [![Health](https://phpackages.com/badges/riwash-simple-file-manager/health.svg)](https://phpackages.com/packages/riwash-simple-file-manager) ``` ### Alternatives [glicer/sync-sftp Sync local files with ftp server 212.7k](/packages/glicer-sync-sftp)[venveo/craft-compress Create smart zip files from Craft assets on the fly 124.7k](/packages/venveo-craft-compress) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)