PHPackages yektadg/medialibrary - 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 & Media](/categories/media) 4. / 5. yektadg/medialibrary ActiveLibrary[Image & Media](/categories/media) yektadg/medialibrary ==================== simple library for handling medias for projects 3(7mo ago)81.4k[1 issues](https://github.com/yektaDG/laravel-media-library/issues)PHP Since Jan 26Pushed 7mo ago3 watchersCompare [ Source](https://github.com/yektaDG/laravel-media-library)[ Packagist](https://packagist.org/packages/yektadg/medialibrary)[ RSS](/packages/yektadg-medialibrary/feed)WikiDiscussions main Synced 1mo ago READMEChangelog (10)Dependencies (3)Versions (14)Used By (0) laravel-media-library ===================== [](#laravel-media-library) MediaLibrary is a laravel library for handling images in laravel projects . You can upload your images , modify their alt , categorize them into the folders and etc. It also compress your images to 4 different sizes and keeps the original size , so you can access them in client side based on user screen or use it with lazy loading . [![Packagist Version](https://camo.githubusercontent.com/e342c34d6df0f39c44927c51e530f50742a2c2f7e4147fc7492e3d9de88f7a76/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6f707469782f6d656469612e737667)](https://packagist.org/packages/yektadg/medialibrary)[![License: GPL v3](https://camo.githubusercontent.com/48bf9b56d44f38db53ce21294cf0b9487d0a3734ab3ba1fe4c69858ae20db2c1/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d47504c76332d626c75652e737667)](https://github.com/yektaDG/laravel-media-library/blob/main/LICENSE.md) Screenshots ----------- [](#screenshots) [![laravel-media-library](https://camo.githubusercontent.com/b90cc5b082077236a0467916c907a83d787324e5e54a6a865a42f938fc2d6b9a/68747470733a2f2f6d656469612e67697068792e636f6d2f6d656469612f76312e59326c6b505463354d4749334e6a45784d32566d4d6a55304d6a646a596a5a6d595751335a546b344e6d45305a6a6778596a45354e545534596a466a4d47466c596a6b304e435a6a6444316e2f6464734130794c5a323272475176743042672f67697068792e676966)](https://camo.githubusercontent.com/b90cc5b082077236a0467916c907a83d787324e5e54a6a865a42f938fc2d6b9a/68747470733a2f2f6d656469612e67697068792e636f6d2f6d656469612f76312e59326c6b505463354d4749334e6a45784d32566d4d6a55304d6a646a596a5a6d595751335a546b344e6d45305a6a6778596a45354e545534596a466a4d47466c596a6b304e435a6a6444316e2f6464734130794c5a323272475176743042672f67697068792e676966) Installation ------------ [](#installation) You can install the package via composer: ``` composer require yektadg/medialibrary ``` Once installed, you should publish the provided assets to create the necessary migration and config files. ``` php artisan vendor:publish --provider="YektaDG\Medialibrary\Providers\MediaLibraryServiceProvider" ``` Requirements ------------ [](#requirements) [BootStrap 5](https://getbootstrap.com/) [jQuery](https://jquery.com/) [Axios Js](https://axios-http.com/docs/intro) Usage ----- [](#usage) Just add the following line at the end of your laravel blade after all javascript codes . ``` ``` If you want to just access the media library view for using alongside your customized view you can use the following line . ``` ``` If you want to use both on the same page beware of id conflict between them . Then you must add `ml-button` class to your html button to open the library . You can use MediaLibrary for different use types ( you can view all usage under this section ) , so you should specify it when defining button . Sample of defining MediaLibrary for `hidden` usage : ``` Upload Images ``` In above code after clicking on `Upload Images` MediaLibrary pops up and after selecting images , they will be stored in the hidden input with html id `image-holder-1` . The three first attributes are MediaLibrary attributes .you can see all of MediaLibrary attributes in the below section . ### Attributes [](#attributes) MediaLibrary uses different html attributes on html elements (like buttons,anchor and ...) to handle different situation . You can see list of attributes below : AttributeDescription`useType`Defines the type of element for usage (for now 3 types are supported : `hidden` , `imagePreview` , `tinymce`)`multipleSelect`Allows MediaLibrary to select multiple images for use (like when you use tinymce)`useId`Refers the html element that holds the imagesNote : All attributes and their values are case-sensitive Features -------- [](#features) ### Limiting Access To Medias [](#limiting-access-to-medias) You can limit access to medias by adding `accessAllMedia` attribute to the `Request` using laravel middleware. Here is the example how to do it : 1. First make a middleware with laravel command `php artisan make:middleware CheckAccessMedia` 2. Register your middleware in `kernel.php` at `$routeMiddleware` array in `Http` folder of your project `'CheckMediaAccess' => CheckMediaAccess::class` 3. Then add the alias of your middleware in `middleware` array in `medialibray.php` at config folder of your project in this case `'CheckMediaAccess'` 4. Edit your newly created middleware and add your condition for example : ``` public function handle(Request $request, Closure $next) { $user = auth()->user(); $condition = false; if ($user && $user->id == 1) { $condition = true; } $request->merge(['accessAllMedia' => $condition]); return $next($request); } ``` In above example user with id of `1` can access all of uploaded medias but all other users can only access their medias. ### Lazy Loading [](#lazy-loading) MediaLibrary generates images in 4 different size , you can use them for lazy loading . Below code loads images based on user screen size : ``` /** * changes the image tag src based on windwos */ $(document).ready(() => { let images = []; let i = 0; $('.resizing').each(function () { const sizes = [1280, 1500]; let src = $(this).attr('originalSrc'); let name = src.slice(0, src.lastIndexOf('.')) let size = getClosest(sizes, $(window).width()); let ext = src.substring(src.lastIndexOf(".") + 1); let path = name + `-${size}x-${ext}`; images.push({ 'id': ++i, 'element': this, 'url': path, }) }) if (images.length > 0) { imageExist(images) } }) /** * check if image exists then put it in src else replace it with original Image */ function imageExist(images) { const result = images.reduce((obj, cur) => ({...obj, [cur.id]: cur}), {}) //converting to map axios.post(imageExistRoute, { 'images': images }).then(res => { res.data.forEach(el => { let element = $(result[el['id']]['element']); if (el['element'] == true) { element.attr('src', el['url']) // setting the new src } else { element.attr('src', element.attr('originalSrc')) } }) }).catch(); } /** * returns the closest number to the window size * @param arr * @param target * @returns {*} */ function getClosest(arr, target) { if (arr == null) { return } return arr.reduce((prev, current) => Math.abs(current - target) ``` Note : default image should have low disk size and be a constant image for all pages ### Language [](#language) You can edit `toast.blade.php` for changing toast header in `resources/views/vendor/yektadg/medialibrary`. For changing toast messages edit `mlLang.js` in `public/vendor/yektadg/medialibrary`. ### Health Score 39 — LowBetter than 86% of packages Maintenance62 Regular maintenance activity Popularity20 Limited adoption so far Community13 Small or concentrated contributor base Maturity53 Maturing project, gaining track record Bus Factor1 Top contributor holds 97.2% 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 ~82 days Recently: every ~199 days Total 13 Last Release 212d ago Major Versions 1.05 → 2.02023-08-07 ### Community Maintainers ![](https://www.gravatar.com/avatar/80994d35760386cd7517cc79b58fed408ac137f4b293272bafebf0255e0ea7bb?d=identicon)[yektaDG](/maintainers/yektaDG) --- Top Contributors [![zmilad97](https://avatars.githubusercontent.com/u/37954357?v=4)](https://github.com/zmilad97 "zmilad97 (105 commits)")[![davoodf1995](https://avatars.githubusercontent.com/u/19805938?v=4)](https://github.com/davoodf1995 "davoodf1995 (1 commits)")[![Ftmhajizadeh](https://avatars.githubusercontent.com/u/123626792?v=4)](https://github.com/Ftmhajizadeh "Ftmhajizadeh (1 commits)")[![yektaDG](https://avatars.githubusercontent.com/u/106602247?v=4)](https://github.com/yektaDG "yektaDG (1 commits)") ### Embed Badge ![Health badge](/badges/yektadg-medialibrary/health.svg) ``` [![Health](https://phpackages.com/badges/yektadg-medialibrary/health.svg)](https://phpackages.com/packages/yektadg-medialibrary) ``` ### Alternatives [league/glide Wonderfully easy on-demand image manipulation library with an HTTP based API. 2.6k51.2M116](/packages/league-glide)[jenssegers/imagehash Perceptual image hashing for PHP 2.1k2.2M5](/packages/jenssegers-imagehash)[intervention/image-laravel Laravel Integration of Intervention Image 1496.5M102](/packages/intervention-image-laravel)[bkwld/croppa Image thumbnail creation through specially formatted URLs for Laravel 510496.0k23](/packages/bkwld-croppa)[lasserafn/php-initial-avatar-generator A package to generate avatars with initials for PHP 4374.2M13](/packages/lasserafn-php-initial-avatar-generator)[rtippin/messenger Laravel messenger suite. 45035.8k4](/packages/rtippin-messenger) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)