warpig
warpig
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
or add this at the end of your registered media conversions
->nonQueued();
->nonQueued();
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
found a solution for creating folders: https://stackoverflow.com/questions/78482222/laravel-media-library-responsive-images basically add this to your env
QUEUE_CONVERSIONS_BY_DEFAULT=false
QUEUE_CONVERSIONS_BY_DEFAULT=false
by default the plugin processes image conversions using queues by default. if you do not have queues configured or running, then conversions and/or responsive images will not be generated.
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
so basically, that's it, thanks for reading this long ass post. i am usually not very good at deciphering plugins and get really anxious and skeptical about documentations as the end result almost never ever ever ever ever works out as they intended. probably because every situation is different than the controlled environment they propose, and i can understand that. i also understand there could be a few things im not considering before trying out these concepts, hope someone can help.
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
what is the problem? several. actually. 1) one single image gets stored within the
storage/app/public/1
storage/app/public/1
route, no collection of images are created. i learnt that the desired outcome should output something like this:
storage/app/public/1/
├── conversions/
├── responsive-images/
└── original_image.webp
storage/app/public/1/
├── conversions/
├── responsive-images/
└── original_image.webp
this is the result on the html:
<img src="http://127.0.0.1/storage/1/01J7VAF1JW0B3FPZ6BHAX2YQS5.webp" srcset="" alt="Beatae ut ut rerum cupiditate similique omnis.">
<img src="http://127.0.0.1/storage/1/01J7VAF1JW0B3FPZ6BHAX2YQS5.webp" srcset="" alt="Beatae ut ut rerum cupiditate similique omnis.">
all i get is a blank srcset and can only grab the original image. 🥳 also, no conversions nor responsive-images folders are created either. 2) the thumbnail doesn't preview my image if i want to edit a post, the thumbnail preview on the form fails to load any image inside the thumbnail box. i really don't know what's going on here probably something outside the scope of filament??
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
and finally, the blade:
<img
src="{{ $post->getFirstMediaUrl('thumbnails') }}"
srcset="{{ $post->getFirstMedia('thumbnails')->getSrcset('thumb') }}"
alt="{{ $post->title }}"
>
<img
src="{{ $post->getFirstMediaUrl('thumbnails') }}"
srcset="{{ $post->getFirstMedia('thumbnails')->getSrcset('thumb') }}"
alt="{{ $post->title }}"
>
https://spatie.be/docs/laravel-medialibrary/v11/responsive-images/getting-started-with-responsive-images what i understand from this is that i can use srcset to display the collection of responsive images which depending on the context the image should resize and have to reference the collection as well as the conversion as you can see.
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
the method on my Post model has all of the classes imported and i am utilizing just one conversion 'thumb':
use Spatie\MediaLibrary\HasMedia;
use Spatie\MediaLibrary\InteractsWithMedia;
use Spatie\MediaLibrary\MediaCollections\Models\Media;

class implements HasMedia
use InteractsWithMedia;

public function registerMediaConversions(Media $media = null): void
{
$this->addMediaConversion('thumb')
->width(368)
->height(232)
->withResponsiveImages();
}
use Spatie\MediaLibrary\HasMedia;
use Spatie\MediaLibrary\InteractsWithMedia;
use Spatie\MediaLibrary\MediaCollections\Models\Media;

class implements HasMedia
use InteractsWithMedia;

public function registerMediaConversions(Media $media = null): void
{
$this->addMediaConversion('thumb')
->width(368)
->height(232)
->withResponsiveImages();
}
Preparing my model:https://spatie.be/docs/laravel-medialibrary/v11/basic-usage/preparing-your-model https://spatie.be/docs/laravel-medialibrary/v11/converting-images/defining-conversions what i understand now is that,
registerMediaConversion
registerMediaConversion
method is used to specify "conversions" and you can apply several methods to it, since i need to have several responsive images, i am using
withResponsiveImages()
withResponsiveImages()
filament will then auto generate medium, large and extra large versions for my post images. edit: i actually had to add several conversions, for example:
$this->addMediaConversion('small')
->width(320)
->height(240)
->nonQueued(); <- this part saved the day basically
$this->addMediaConversion('small')
->width(320)
->height(240)
->nonQueued(); <- this part saved the day basically
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
Table component:
SpatieMediaLibraryImageColumn::make('thumbnail')
->collection('thumbnails'),
SpatieMediaLibraryImageColumn::make('thumbnail')
->collection('thumbnails'),
at first i couldn't display anything but later found out about the APP_ENV thing, so now i can show images. changed my variable to
(APP_URL=http://127.0.0.1)
(APP_URL=http://127.0.0.1)
11 replies
FFilament
Created by warpig on 9/15/2024 in #❓┊help
Spatie media library responsive images
My form component looks like this:
SpatieMediaLibraryFileUpload::make('thumbnail')
->required()
->collection('thumbnails')
->responsiveImages(),
SpatieMediaLibraryFileUpload::make('thumbnail')
->required()
->collection('thumbnails')
->responsiveImages(),
Form component: https://filamentphp.com/plugins/filament-spatie-media-library#form-component Generating responsive images: https://filamentphp.com/plugins/filament-spatie-media-library#generating-responsive-images I learnt that you have to have a collection otherwise responsive images won't work.
11 replies
FFilament
Created by warpig on 5/11/2024 in #❓┊help
500 server error after updating user model
forgot to import Panel, the error is gone 😮
9 replies
FFilament
Created by warpig on 5/11/2024 in #❓┊help
500 server error after updating user model
for now the method is not part of my codebase to allow the website to load correctly, that is why "yourdomain" is there
9 replies
FFilament
Created by warpig on 5/11/2024 in #❓┊help
500 server error after updating user model
<?php

namespace App\Models;

// use Illuminate\Contracts\Auth\MustVerifyEmail;
use App\Models\Post;
use Illuminate\Notifications\Notifiable;
use Filament\Models\Contracts\FilamentUser;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;

class User extends Authenticatable implements FilamentUser
{
use HasFactory, Notifiable;

public function canAccessPanel(Panel $panel): bool
{
return str_ends_with($this->email, '@yourdomain.com') && $this->hasVerifiedEmail();
}
}
<?php

namespace App\Models;

// use Illuminate\Contracts\Auth\MustVerifyEmail;
use App\Models\Post;
use Illuminate\Notifications\Notifiable;
use Filament\Models\Contracts\FilamentUser;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;

class User extends Authenticatable implements FilamentUser
{
use HasFactory, Notifiable;

public function canAccessPanel(Panel $panel): bool
{
return str_ends_with($this->email, '@yourdomain.com') && $this->hasVerifiedEmail();
}
}
this works?
9 replies
FFilament
Created by warpig on 5/11/2024 in #❓┊help
500 server error after updating user model
oh and logs show this:
Cannot instantiate abstract class App\Models\User
Cannot instantiate abstract class App\Models\User
9 replies
FFilament
Created by warpig on 5/11/2024 in #❓┊help
500 server error after updating user model
and yes, i did imported the class and implements FilamentUser, what did i missed?
9 replies
FFilament
Created by warpig on 5/3/2024 in #❓┊help
installing version 3
yes the comment above worked. these were the commands i used:
// views the installed packages
php -i | grep ini

// intl for my version of php
sudo apt-get install php8.3-intl
// views the installed packages
php -i | grep ini

// intl for my version of php
sudo apt-get install php8.3-intl
7 replies
FFilament
Created by warpig on 5/3/2024 in #❓┊help
installing version 3
Doesn’t seem be to working 😣
7 replies
FFilament
Created by warpig on 8/21/2023 in #❓┊help
displaying responsive images using SpatieMediaLibrary plugin for filament
🫡
11 replies
FFilament
Created by warpig on 8/21/2023 in #❓┊help
displaying responsive images using SpatieMediaLibrary plugin for filament
but yeah i think it worked might be the case for another question? 😄
11 replies
FFilament
Created by warpig on 8/21/2023 in #❓┊help
displaying responsive images using SpatieMediaLibrary plugin for filament
11 replies
FFilament
Created by warpig on 8/21/2023 in #❓┊help
displaying responsive images using SpatieMediaLibrary plugin for filament
So both but i want to fix the front end first
11 replies
FFilament
Created by warpig on 8/21/2023 in #❓┊help
displaying responsive images using SpatieMediaLibrary plugin for filament
But also on the table
11 replies