Para la actualización a Drupal 10 uno de los cambios más importantes es la actualización del módulo CKEditor a CKEditor5.
El cambio más importante es el referente a los parámetros y plugins creados hasta la fecha, estos dejan de funcionar y se deberán adaptar al nuevo formato que requiere esta nueva versión.
Para cambiar de CKEditor 4 a CKEditor 5 en Drupal 9 sigue estos pasos:
Si ya estás utilizando la versión de Drupal 9.4 o 9.5 encontrarás el módulo CKEditor5 en la sección correspondiente a los módulos en tu sitio web, inicia sesión como administrador en tu sitio de Drupal y ve a la página de administración de módulos (/admin/modules). Si estás usando una versión inferior de Drupal no aparecerá, es necesario actualizar a 9.4 o 9.5.
Habilita el módulo CKEditor 5. Busca "CKEditor 5" en la lista de módulos y marca la casilla de selección junto a él. Luego, haz clic en el botón "Guardar configuración" para habilitar el módulo.
Se recomienda leer la documentación y ayuda que proporciona el propio módulo, se encuentra en la siguiente ruta (/admin/help/ckeditor5).
Ve a la página donde se encuentran los formatos de texto incorporados en tu sitio web (/admin/config/content/formats). Verás que en la columna Editor de texto aparece el editor de texto usado para cada uno, vamos a editar los que en esta columna aparece CKEditor.
Una vez dentro de cada formato de texto, de entre todas las opciones hay un select con título Editor de texto el cual estará con el valor CKeditor, habrá que cambiar el valor de este select a CKEditor5. Automáticamente el CKEditor5 reajusta el formato de texto para mantener las mismas configuraciones que existían previamente. Aparecerá una notificación conforme es correcto.
Es obligatorio para cualquier formato de texto en CKEditor5 que existan los tags y como mínimo, no podremos mantener un formato de texto sin esos tags.
Si el Plugin de Style aparece como activado pero vacío, en este caso habrá que quitar el botón de Style de la barra de herramientas activa, basta con arrastrar el botón fuera.
Comprobar que los filtros habilitados, el orden de procesamiento de filtros, los roles, los tags permitidos y los plugins y sus configuraciones (sin contar el Source editing, explicado en el paso siguiente) son los mismos que con el antiguo formato de texto en CKEditor4.
El Source editing aparecerá modificado ya que el tratamiento de este plugin en CKEditor5 es diferente a la versión anterior y el propio CKEditor lo modifica para que aparezca correctamente, aún así el propio Plugin incorpora un mensaje de ayuda en la parte inferior del textarea donde introducir los datos.
Hay varias funcionalidades por defecto en CKEditor 5 que puede que te desesperen, ya que en la versión 4 no tenías que preocuparte por ellas y venían tal cual. El cambio puede que te descoloque un poco, pero siempre puedes modificar o añadir funcionalidades a través de js, por ejemplo:
Para eliminar el atributo lang del copiar + pegar en un editor de CKEditor5:
´´´ if (typeof CKEditor5 !== 'undefined') { var ckeditor; var editor; var domEditableElements = document.querySelectorAll('.ck-editor__editable'); for (let domEditableElement of domEditableElements) { ckeditor = $(domEditableElement).closest('.ck-editor'); editor = domEditableElement.ckeditorInstance; editor.editing.view.document.on('clipboardInput', (evt, data) => { if (data.dataTransfer.getData('text/html') != '') { const dataTransfer = data.dataTransfer; const content = dataTransfer.getData('text/html').replaceAll('lang=', ''); data.content = editor.data.htmlProcessor.toView(content); } }); } } ´´´
Toni Caballero
Toni Caballero
Quim Parnau
