Gwiazdka nieaktywnaGwiazdka nieaktywnaGwiazdka nieaktywnaGwiazdka nieaktywnaGwiazdka nieaktywna
 

CKEditor 5 po pobraniu możemy zainstalować m.in. w pliku layout.phtml (Listing 1.), jak również w pliku widoku np. view/admin/article/index.phtml (Listing 3.). 

  

Listing 1. Instalacja CKEditor 5 w Zend Framework 3 w pliku layout.phtml

<!-- CKEditor 5 Zend Framework 3 -->
<?= $this->doctype() ?>
<html lang="pl">
<head>
   ...
   $this->headScript()->appendFile($this->basePath('shared/ckeditor5-build-classic/ckeditor.js'))
   ->appendFile($this->basePath('shared/js/configureckeditor5.js'));
</head>
<body>
   ...
   <?= $this->content ?>
   ...
</body>
</head> 

 

Instalowanie w pliku widoku index.phtml przeprowadzamy w dwóch etapach. Najpierw dodajemy $this->headScript() i $this->inlineScript()  do pliku layout.phtml (Listing 2.). Następnie wprowadzamy odpowiedni skrypt do pliku np. view/admin/article/index.phtml (Listing 3.).

 

Listing 2. Fragment pliku layout.phtml

<!-- Zend Framework podstawy -->
<?= $this->doctype() ?>
<html lang="pl">
<head>
   ...
   <?= $this->headScript() ?>
   </head>
<body>
   ...
   <?= $this->content ?>
   ...
   <?= $this->inlineScript() ?>
</body>
</head>

 

Listing 3. Plik widoku view/admin/article/index.phtml

<?php
// Instalacja CKEditor 5
// Dodajemy w części head

$this->headScript()->appendFile($this->basePath('shared/ckeditor5-build-classic/ckeditor.js'));

// Dodajemy przed znacznikiem </body>.

// Kod pliku JavaScript na Listingu 4.
$this->inlineScript()->prependFile($this->basePath('shared/js/configureckeditor5.js'));
?>
<h1>Classic editor</h1>
<textarea name="content" id="editor">
W tym miejscu wprowadzamy własny tekst
</textarea> 

 

Listing 4. Konfiguracja CKEditor 5 w pliku shared/js/configureckeditor5.js

// Instalacja CKEditor 5
ClassicEditor
.create(document.querySelector('#editor'))
.then(editor=>{
   console.log(editor);
})
.catch(error => {
   console.error(error);
}); 

 

Pierwszy sposób instaluje CKEditor 5 na wszystkich stronach. Drugi tylko tam, gdzie jest używany element formularza textarea z identyfikatorem editor.

 

Wybrane książki:

 Wybrane strony:

Książki Helion