Appearance
Record Covers
Every record has a cover image that must be stored in the storage/app/public/covers directory. With the symlink we created earlier, the covers are publicly accessible via the public/storage/covers directory.
The symlink allows the storage/app/public directory to be accessible via the /storage URL, making the cover images available to the frontend.
As you may have noticed, there is no cover
column in the records
table. The name of the image refers to the record's mb_id
column. E.g. if the mb_id
value is 7dc5edce-ead6-41e4-9c4b-240223c9bab0
, the cover image must be 7dc5edce-ead6-41e4-9c4b-240223c9bab0.jpg
.
There is also one special image named no-cover.png
that is used as a placeholder when a cover image is missing.
Later on in the course, we discuss some scripts to upload, replace, and delete cover images, but to start using the covers in our shop page, we prepared a small script to download a zip file containing all the covers and extract them to the right folder.
Download the Covers
REMARKS
The script we prepared is written in "pure PHP" and does not use much of the Laravel framework, therefore we will not discuss this code in detail. Because this script is only used to speed up the development process, we will not add it to the navigation menu.
Later on, you can re-run this script every time you need to reset to the default covers. This approach was chosen to simplify the process and avoid dependencies on Laravel-specific features for this one-time setup.
- Create a new file download_covers.blade.php inside the resources/views/admin directory
- Create a route to the download_covers page in routes/web.php
- Add a new route to the admin section in routes/web.php
php
Route::prefix('admin')->group(function () {
Route::redirect('/', '/admin/records');
Route::get('records', function (){...})->name('records');
Route::view('download_covers', 'admin.download_covers')->name('download_covers');
});
1
2
3
4
5
2
3
4
5
Now run the script by opening the url https://vinyl_shop.test/admin/download_covers in your browser.
Because of the symlink, the covers will be visible in the storage/app/public/covers directory and in the public/storage/covers directory.
Covers folder is not visible in PhpStorm?
The covers folder
might not appear in PhpStorm.
Open the File menu and choose Reload All from Disk to refresh the directory structure.
On the frontend, the covers are accessible via the url https://vinyl_shop.test/storage/covers/7dc5edce-ead6-41e4-9c4b-240223c9bab0.jpg (without public
in the url).
Click on one of the cover images to view it in full size.