CK Editor in Laravel

Schritt 1: CK Editor via CDN integrieren

Im Layout File Links im Header hinzufügen:

{{-- CKEditor CDN --}}

<link rel="stylesheet" href="https://cdn.ckeditor.com/ckeditor5/43.3.1/ckeditor5.css" />

<script src="https://cdn.ckeditor.com/ckeditor5/43.3.1/ckeditor5.umd.js"></script>

Schritt 2: Editor im blade file bei Bedarf integrieren

Am Ende vom Blade File hinzufügen:

@push('scripts')

<script>

const {

ClassicEditor,

Heading,

Essentials,

Bold,

Italic,

List,

Paragraph

} = CKEDITOR;

ClassicEditor

.create(document.querySelector('#description'), {

plugins: [Heading, Essentials, Bold, Italic, List, Paragraph],

toolbar: [

'heading', '|', 'bold', 'italic', 'bulletedList', 'numberedList', '|', 'undo', 'redo'

]

})

.then(editor => {

editor.model.document.on('change:data', () => {

@this.set('description', editor.getData());

})

})

.catch(error => {

console.error(error);

});

</script>

@endpush