To install CKEditor in Laravel, you can use the "laravel-ckeditor" package. Here are the steps to install and use it:
- Install the package using composer:
composer require unisharp/laravel-ckeditor
- Publish the CKEditor assets:
php artisan vendor:publish --tag=ckeditor
- Include the CKEditor script and stylesheet in your layout file:
<head>
...
<script src="{{ asset('vendor/unisharp/laravel-ckeditor/ckeditor.js') }}"></script>
<link rel="stylesheet" href="{{ asset('vendor/unisharp/laravel-ckeditor/skins/moono-lisa/editor.css') }}">
</head>
- Use the CKEditor in your form:
<form>
...
<textarea name="content" id="editor"></textarea>
</form>
<script>
CKEDITOR.replace('editor');
</script>
To upload images in CKEditor, you can use the "laravel-ckeditor-upload" package. Here are the steps to install and use it:
- Install the package using composer:
composer require unisharp/laravel-ckeditor-upload
- Publish the CKEditor upload assets:
php artisan vendor:publish --tag=ckeditor-asset
- Include the CKEditor upload script in your layout file:
<head>
...
<script src="{{ asset('vendor/unisharp/laravel-ckeditor-upload/ckeditor.js') }}"></script>
</head>
- Use the CKEditor with image upload in your form:
<form>
...
<textarea name="content" id="editor"></textarea>
</form>
<script>
CKEDITOR.replace('editor', {
filebrowserUploadUrl: "{{ route('ckeditor.upload', ['_token' => csrf_token() ]) }}",
filebrowserUploadMethod: 'form'
});
</script>
Note: Make sure to add the "csrf_token" to the upload URL to prevent CSRF attacks. Also, make sure to configure the CKEditor upload settings in the "config/ckeditor.php" file.