PHPackages sergmoro1/laravel-imageable - 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. sergmoro1/laravel-imageable ActiveLibrary[File & Storage](/categories/file-storage) sergmoro1/laravel-imageable =========================== The ability to upload multiple images to any model v1.0.2(1y ago)19MITPHPPHP ^7.3|^8.0|^8.0.2|^8.1|^8.2 Since May 16Pushed 1y ago1 watchersCompare [ Source](https://github.com/sergmoro1/laravel-imageable)[ Packagist](https://packagist.org/packages/sergmoro1/laravel-imageable)[ RSS](/packages/sergmoro1-laravel-imageable/feed)WikiDiscussions main Synced 1mo ago READMEChangelogDependencies (4)Versions (4)Used By (0) Laravel Imageable ================= [](#laravel-imageable) The `Imageable` package allows quickly and easily to enable image uploading for any model. Uploading files, processing them, and saving them to the desired storage is taken over by `Imageable`. Besides each image may have some descriptive fields associated with it. API --- [](#api) The `Imageable` package uses the `API` to download, process and save files. Therefore, authentication is required for the package to work. By default, `basic` stateless authentication is used to pass tests and make to a quick start. Changes ------- [](#changes) `Tailwindcss` is used in `Imageable` by default, as in the `Laravel`. Since `css`, `js`, `views` resources are published after installing the package, it is possible to change templates and customize interface elements. Limitation of use ----------------- [](#limitation-of-use) Only one component `` can be placed on the page. Installation ------------ [](#installation) ``` composer require sergmoro1/laravel-imageable ``` Run migration ------------- [](#run-migration) ``` php artisan migrate ``` Publish resources ----------------- [](#publish-resources) ``` php artisan vendor:publish --provider="Sergmoro1\Imageable\ImageableServiceProvider" ``` Usage ----- [](#usage) For ability images uploading add `HasStorage`, `HasImages` traits to the model. ``` use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; use Sergmoro1\Imageable\Traits\HasStorage; use Sergmoro1\Imageable\Traits\HasImages; class Post extends Model { use HasFactory, HasStorage, HasImages; ``` Insert upload component in a view. ``` ``` Please note that the component uses an instance of the model, therefore, it must be available in the template. The `limit` parameter defines the number of images that can be uploaded for the model. The default is `0`, which means you can upload any number of images. If the necessary `css` and `js` files are already connected to the page, and this is possible if you have already connected `Imageable` for another model, then you can upload images. ### JS libs & plugins [](#js-libs--plugins) Add in `dependencies` section of the `package.json` file two lines ``` "sortablejs": "^1.15.1" ``` Then run in the console ``` npm update ``` ### CSS [](#css) In a file `resources/css/app.css`, after lines ``` @tailwind base; @tailwind components; @tailwind utilities; ``` add line ``` @import "./imageable/upload.css"; ``` If necessary, you can make adjustments to the classes definition in the `resources/css/imageable/upload.css` file since this is a copy of a similar package file. ### JS [](#js) To upload images and work with additional fields related to images, add two lines to `app.js`. ``` require('./imageable/axiosUpload.js'); require('./imageable/imageLine.js'); ``` If you want to upload more than one file for a specific model, you can add a plugin for sorting of images [Sortable](https://github.com/SortableJS/Sortable). This is important when you want to change the order of image output in frontend or want to use the first image as the main image. Sorting is performed by drag & drop the mouse. Add a line below for images sorting to `app.js`. ``` require('./imageable/sortable.js'); ``` ### CSS placement [](#css-placement) The `Imageable` package uses `Google Material Icons`, so you need to connect the icons to the page. For example in `views/layouts/app.blade.php `. ``` ``` ### JS placement [](#js-placement) Since the `Imageable` package uses the `API` to upload files, authentication is required. By default, the package uses `basic` stateless authentication to run tests and quickly start using the package. Place the `app_credentials` variable on the page. The variant of receiving credentials is yours. ``` var app_credentials = ''; {{ $scripts }} ``` ### Finally [](#finally) Run in the project directory ``` npm run dev ``` Configuration ------------- [](#configuration) The storage parameters, the view of line associated with the uploaded file, the number and values of additional parameters can be changed. ### Model [](#model) By default, the parameters for storing images are set ``` 'disk' => 'public', 'path' => '', 'seperatly' => true, ``` An empty `path` parameter means that a subdirectory with the model name will be created on the selected disk. For example, `storage/app/public/post`. The `separately` parameter set to `true` means that a separate directory will be created for each model with the `Id` of the model as the name. For example, `storage/app/public/post/1`. Storage parameters can be changed according to the principles of Laravel file storage using the `setStorage` method of the `Sergmoro1\Imageable\Traits\HasStorage` class. Only the `caption` field is set as an additional field for each image. The list of fields, their order and default values can also be redefined using the `setAddonDefaults()` method of the class `Sergmoro1\Imageable\Traits\HasImages`. Both methods must be called in the constructor of the corresponding model. For example, defining fields: ``` class Post extends Model { use HasFactory, HasStorage, HasImages; public function __construct(array $attributes = []) { parent::__construct($attributes); $this->setAddonsDefaults([ 'year' => '', 'category' => 'home', 'caption' => '', ]); } ``` ### Views [](#views) After installing and publishing the package, the component files are copied to the `resources\views\vendor\imageable` directory, where you can freely edit html markup, change styles and add/remove fields to describe each uploaded image. ### Addon fields [](#addon-fields) To change the list of additional fields of uploaded images, you need to edit the default values in the `addonDefaults` variable of the model, as mentioned above, and the `vendor\imageable\line\fields.blade.php` view, where it is necessary to define additional html markup. An example with possible fields and their values is given in the package in the file `fiealds-example.blade.php`. If the list of additional fields varies from model to model, then the contents of the files `line\fields.blade.php` should be different and therefore the file names should be different. The model variable `$addonFieldsView` is used to specify the file name. The name can be anything, for example: ``` class Post extends Model { use HasFactory, HasStorage, HasImages; protected $addonFieldsView = 'post-fields'; ``` You need to copy the file `vendor\imageable\line\fields.blade.php `to the file `vendor\imageable\line\post-fields.blade.php` and make changes. Tests ----- [](#tests) ``` composer test ``` ### Health Score 27 — LowBetter than 49% of packages Maintenance31 Infrequent updates — may be unmaintained Popularity6 Limited adoption so far Community7 Small or concentrated contributor base Maturity55 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 ~0 days Total 3 Last Release 725d ago PHP version history (3 changes)v1.0.0PHP ^8.1 v1.0.1PHP ^7.3|^8.0|^8.0.2|^8.1 v1.0.2PHP ^7.3|^8.0|^8.0.2|^8.1|^8.2 ### Community Maintainers ![](https://www.gravatar.com/avatar/47754c3aa326cd8f607f8207a47193bb3286eac44fded6dd5a312da13358e76c?d=identicon)[sergmoro1](/maintainers/sergmoro1) --- Top Contributors [![sergmoro1](https://avatars.githubusercontent.com/u/5292104?v=4)](https://github.com/sergmoro1 "sergmoro1 (33 commits)") ### Code Quality TestsPHPUnit ### Embed Badge ![Health badge](/badges/sergmoro1-laravel-imageable/health.svg) ``` [![Health](https://phpackages.com/badges/sergmoro1-laravel-imageable/health.svg)](https://phpackages.com/packages/sergmoro1-laravel-imageable) ``` ### Alternatives [aws/aws-sdk-php-laravel A simple Laravel 9/10/11/12/13 service provider for including the AWS SDK for PHP. 1.7k35.6M75](/packages/aws-aws-sdk-php-laravel)[illuminate/filesystem The Illuminate Filesystem package. 15261.6M2.6k](/packages/illuminate-filesystem)[stechstudio/laravel-zipstream A fast and simple streaming zip file downloader for Laravel. 4633.7M3](/packages/stechstudio-laravel-zipstream)[spatie/laravel-google-cloud-storage Google Cloud Storage filesystem driver for Laravel 2408.9M13](/packages/spatie-laravel-google-cloud-storage)[azure-oss/storage-blob-laravel Azure Storage Blob filesystem driver for Laravel 63582.2k1](/packages/azure-oss-storage-blob-laravel)[spatie/laravel-backup-server Backup multiple applications 17016.7k1](/packages/spatie-laravel-backup-server) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)