Laravel Checklister. Part 15/29: CKEditor with Image Upload
HTML-код
- Опубликовано: 22 май 2021
- In this lesson, we go a little back to our CKEditor and implement the image upload.
How to create your custom CKEditor upload adapter: ckeditor.com/docs/ckeditor5/l...
Repository: github.com/LaravelDaily/Larav...
Playlist with other Checklister videos: • Creating "Laravel Chec...
- - - - -
Support the channel by checking out our products:
- Try our Laravel QuickAdminPanel: bit.ly/quickadminpanel
- Enroll in my Laravel courses: laraveldaily.teachable.com
- Purchase my Livewire Kit: livewirekit.com
- Subscribe to my weekly newsletter: bit.ly/laravel-newsletter 
Хобби
Whenever I come across a problem Povilas and Laraval Daily always has the solution. Thanks a lot.
Great content from Povilas and Laraval Daily 👍
Amazing,as always ,Povilas!
powerfull package, thank you💙
I was looking for it.
How can we track & remove unused files if we don't use the media library here. Suppose I am directly uploading the image to the server and if I don't save the editor contents, the file is still in my server. The same problem arises when we upload files using ajax say - using the dropzone. If we don't save it, the file is still there on the server. I hope you will make a video on how to deal with such situations. Thank you.
Well, I'm not planning to shoot a separate video about it, but it's pretty simple - cleanup the unused files after some time with a daily Artisan command, for example.
Thanks
Well explained, my question is whether we can now add an option to resize images directly in the CKEditor to this code
you are a god !! you saved me jajaja
What is the best way to remove images that are deleted from the editor before saving?
Sir, I love your videos and this is another awesome video for me because I am working with CKEditor On one of my projects. I implemented this image upload on s3 bucket. thank you very much for this. Now I have a question here is that We If we need to remove any image and form server as well what is the way We can do it. Please respond to me. I regularly watch your videos.
Thank you again.
Buen video, me funciono perfectamente. lo recomiendo a cualquiera que sea nuevo utilizando el CKEditor 5 y este utilizando la función de imágenes, este tuto funciona tanto para laravel como laravel mix; en mi caso lo utilice desde el lado de vue en laravel mix. (❁´◡`❁)
tankssssssssssssssss very very goood i love you
Did anyone manage to get image upload in ckeditor to work with jetstream ? I've been battling for days, going over the video, the docs and the github repo over and over again. I'm done in and would love some advice.
Hi guys! When I did this $post->addMediaFromRequest('upload')->toMediaCollection('images'); not upload and not create anything. What could I am doing wrong?
Can we upload the file to google drive with spatie media library?
sir, if i want to resize the image how can I implement this...?
You could have create a .js file for ckeditor upload code and store routes and csrf token in a global variable ?
Hi Sir
I am getting this kind of error when uploading the image. filerepository-no-upload-adapter
Great video! I got a lot of value from this one thanks!
I'm wondering about the reasons of why should I use DB:Media Library table? and not just upload the image and save the file path: /images/ajsdkf-8192-jadsk.png ?
What value it gives to create that media library table?
From my point of view, if i created a task, upload image and remove that task, it's okay if the image will still be saved on the server (or S3...)
What do you think?
Thank you again!
i would say that later you may want to use more different types of this image, not just thumb, but e.g. some bigger versions. imho is the best to store the biggest resolution of image and some smallers too when the design or the page where u shoing them requires it. Storing images in db can sounds as overkill but it can have some positives sides too all depends how your page handle them
after upload image is doesn't show image in my textarea but that image save in my storage how to show that image ?
same here, Have you solved it?
Is it possible to add images that are currently uploaded?
Is there anyway embed the responsive imges from medialibrary
sorry sir, i want to ask.. how about we using ckeditor super build, how to use extraplugin simpelUpload class in there?
thanks before.
my route does not reach the controller, I still have the same error Couldn't upload file:
I would create a TemporaryUpload model (and table) instead of using a fake Task object for everything. After that, you can "attach" those temporary uploads to the right model when you hit the save button.
Good suggestion, another way of doing this thing.
@@LaravelDaily I would be interested in seeing this approach - is it perhaps a suitable topic for a standalone video ?
If I have uploaded an image, it is also uploaded on the server and I do not want to publish my comment and want to delete the image, then in that case how will the image be deleted from the server?
I am facing another problem. Suppose I have to upload any file other than image like pdf, excel, word documents etc.., then how do I upload that
I have searched a lot on the internet but haven't found anything anywhere.
I get Failed to load resource: net::ERR_CONNECTION_REFUSED on my uploaded files!
How about you put the whole CKEditor thing in a js file and add those routes which use it to the 'except' array of VerfiyCsrfToken middleware to avoid the need for a blade file , what do you think ?
Also i didn't get why we're linking the image to a fake task of id=0 , doesn't the image belong to a real task ?
We linked to a fake task id because when you're at a create page uploading a file, the task doesn't yet have an id until it is saved.
I would love an explanation about deleting unused images when uploaded from ckeditor
How uploaded image can be resized using ckeditor 5 resize , can you help on that ?
there's a plugin for that.
@@ikbalmalikramadhan3939 what's that plugin ? Can you provide links for that ?
I just wonder if i can show the images on pdf usgin dompdf
Diamond content
syntax error, unexpected ':', expecting ')' Got this on line
$image = $about->addMediaFromRequest(key:'upload')->toMediaCollection(collectionName:'images');
Kindly Help
That "collectionName:" comes from phpStorm, it's not the part of the code.
I have this error: ReferenceError: server is not defined.. anyone experienced and fixed this error?
Yes, I encountered this. I copied the wrong sample code. Scroll down a bit and get the upload() and abort() methods from the complete example that doesn't reference 'server'
Putting dummy values in the spatie media library call is weird. Since you do not need the relationship itself, I believe there must be a way to upload and use the conversions without having to set a model.
Hi, I am about to subscribe to your service. I saw that there is a premium tutorial for livewire and ckeditor. Is it covers ckeditor image upload with livewire?
If not have you got any premium tutorial that covers image upload with any wysiwyg editor and livewire?
como install mathtype for ckeditor en laravel por favor
How can i manage if i need same CkEditor on other modal Like for Post
My question is when i have multiple Modal Post, News
bdy nice video
I always watching your video
Thank you
Good job, this movie i good explain for me how write custom upload file to ckeeditor. But i see litle problem in business flow.
Customer want always not thinking about complex solution, but realy situation is, what you remove uploaded file if customer remove image from editable html, what if customer remove task... etc.?
I think maybe better is upload and atach real task id in spatie media, becouse if you remove model "task", spatie library also removed uploaded file and conversions.
I realy dont like images in html content but i underestand "Customer want" :) real live.
Greate tutoral +5 for uploader ckeditor.
I got request for you. Could you show us extension for vs code that would improve our coding experience. Thank you.
I don't use VS Code, I use PhpStorm.