File/Photo Upload Fields

In CRUDs Editor, we have two field types for files - called File and Photo. The difference is pretty small - Photo field has additional validation parameters for image size.
For uploading files, we're using a very popular package called Laravel Medialibrary, you can view its official documentation here.
 On the front-end, we're using Dropzone Javascript library, here's how it looks together:
You can read our in-depth tutorial: Multiple File Upload with Dropzone.js and Laravel MediaLibrary Package​
As per Laravel Medialibrary functionality, the files are stored by default in storage/app/public folder, dividing every file in its own subfolder with ID number:
 By default, storage/ internal folders are not available in the browser for public visitors, to change that - you need to run one important Artisan command:
1
php artisan storage:link
Copied!
See more info in the official Laravel documentation: The Public Disk​
If you want to change the location of where files are stored, change your parameters in config/filesystems.php file:
1
'disks' => [
2
​
3
    'local' => [
4
        'driver' => 'local',
5
        'root' => storage_path('app'),
6
    ],
7
​
8
    'public' => [
9
        'driver' => 'local',
10
        'root' => storage_path('app/public'),
11
        'url' => env('APP_URL').'/storage',
12
        'visibility' => 'public',
13
    ],
14
​
15
    's3' => [
16
        'driver' => 's3',
17
        'key' => env('AWS_ACCESS_KEY_ID'),
18
        'secret' => env('AWS_SECRET_ACCESS_KEY'),
19
        'region' => env('AWS_DEFAULT_REGION'),
20
        'bucket' => env('AWS_BUCKET'),
21
        'url' => env('AWS_URL'),
22
    ],
23
​
24
],
Copied!
In the database, filenames for all CRUDs are stores in one DB table media - this is how Laravel Medialibrary works.
This table uses Polymorphic Relations to tie the media record to the CRUD Model it belongs to - see columns model_type and model_id.
Troubleshooting
We can't ensure that all file uploads settings will be correct on your web-server. So if something doesn't work on your web-server after download, check out this guide on our blog: Top 5 Questions/Answers About Spatie MediaLibrary - it answers these questions:
Where are my files stored? 
Why are my files not shown? 404 error? 
How to generate/customize thumbnails? 
How to query Media relationships in Eloquent? 
Why artisan migrate doesn’t work with MediaLibrary?
Another article related to potential file/photo problem: 
Why it&#8217;s important to change APP_URL in Laravel .env file
Quick Admin Panel
Extra Customizations
If you want to save disk space, here's an article for you:
Spatie MediaLibrary: Resize Original Uploaded Image to Save Disk Space
Quick Admin Panel
If you want to change the maximum file size to upload, there will be a few places for that setting.
In create.blade.php and edit.blade.php of your CRUD, at the bottom there's a Dropzone setting maxFilesize, which by default is 2 MB:
1
@section('scripts')
2
<script>
3
    Dropzone.options.photoDropzone = {
4
    url: '{{ route('admin.products.storeMedia') }}',
5
    maxFilesize: 2, // MB
Copied!
Also, you will need to update Laravel, PHP, and web-server settings on the back-end. For this, please read the detailed article: 
Validate Max File Size in Laravel, PHP and Web-Server - Laravel Daily
Laravel Daily
​
​

Quick Start: Creating Panel - Previous

Relationships fields: belongsTo/belongsToMany

Next - Quick Start: Creating Panel

Date/Time Picker Fields

Last modified 1yr ago

Copy link

Contents

Troubleshooting

Extra Customizations