Blog

test
29/12/2023

Upgrade Drupal 10: CKEditor 4 vs CKEditor 5

La transition de CKEditor 4 à CKEditor 5 est une étape cruciale pour garantir la continuité de l'éditeur de texte dans votre environnement Drupal. Dans cette section, nous abordons les avertissements liés à CKEditor 4, les étapes recommandées pour la mise à jour des modules et les ajustements nécessaires pour une intégration réussie de CKEditor 5.

Problème rencontré : CKEditor 4 identifié comme obsolète :
Avant de se lancer dans l'upgrade vers Drupal 10, il est impératif de désinstaller CKEditor 4 dans la version Drupal 9 existante. Dans cet article, nous expliquerons les avertissements associés, leur signification, et détaillerons les étapes pour la mise à jour des modules, l'installation de CKEditor 5, et la mise à jour des formats de texte.

Avertissement : Deprecated modules found: CKEditor 4 (contrib), Color, Quick Edit, RDF.
Signification : L'avertissement indique que le module est obsolète et qu'il n’est plus recommandé pour une utilisation future.

Solution Recommandée :

Mettre à jour les modules :
La première étape consiste à déterminer quels modules fournissent des plugins CKEditor 4, et de vérifier leur compatibilité avec CKEditor 5.

Installer CKEditor 5 :
Une fois que tous les modules, qu'ils soient contribués ou personnalisés, sont mis à jour pour être compatibles avec CKEditor 5, vous pouvez installer le module CKEditor 5, qui est fourni dans Drupal 9.5 et versions ultérieures.

Mettre à jour les formats de texte :
La configuration de l'éditeur CKEditor est associée à chaque format de texte individuel. Vous devrez mettre à jour chaque format de texte individuellement en accédant à la page d'administration "Text formats and editors" (/admin/config/content/formats). Identifiez les formats où l'éditeur texte est configuré comme "CKEditor" et changez la valeur du champ "Text editor" en "CKEditor 5".

Mettre à jour vos styles :
Dans CKEditor 5, ckeditor_stylesheets devient ckeditor5-stylesheets. Cette transition peut affecter la mise en page de l'ensemble de la page, car CKEditor 5 est généralement intégré directement dans la page, sans <iframe>. Pour éviter tout problème de style, envisagez une feuille de style distincte pour l'éditeur et assurez-vous d'inclure le sélecteur suivant en haut de votre feuille de style :

.ck.ck-content {
   /* Vos styles personnalisés ici */
}

N'oubliez pas de mettre à jour vos styles en conséquence lors de la mise à jour vers CKEditor 5.

Tester :
Comme pour toute mise à jour, il est essentiel de tester soigneusement pour vous assurer que toutes les fonctionnalités se comportent comme prévu avant de déployer la mise à jour sur vos sites de production.

Désinstaller le module CKEditor 4 :
Une fois que tous les formats de texte ont été mis à jour et que les tests sont terminés avec succès, vous pouvez désinstaller le module CKEditor 4.

Conclusion : 
La transition de CKEditor 4 à CKEditor 5 revêt une importance cruciale dans le processus d'upgrade vers Drupal 10. Cette évolution garantit une expérience d'édition moderne, conforme aux dernières normes de l'écosystème Drupal.

Nous avons exploré les avertissements liés à CKEditor 4, mettant en lumière la nécessité de dépasser cette version obsolète pour maintenir la compatibilité avec les futures mises à jour de Drupal. Les solutions recommandées, telles que la mise à jour des modules, l'installation de CKEditor 5, et les ajustements au niveau des formats de texte, offrent une approche systématique pour assurer une transition en douceur.

Les conseils sur la mise à jour des styles, avec l'attention portée à la feuille de style distincte pour CKEditor 5, soulignent l'importance de prendre en compte les aspects visuels pour éviter tout impact sur la mise en page.
Enfin, nous avons souligné l'importance des tests approfondis avant le déploiement sur des sites de production, assurant ainsi une migration réussie sans perturbations majeures.

En poursuivant notre série sur l'upgrade Drupal 10, le prochain volet se penchera sur un autre aspect essentiel : "Upgrade Drupal 10 : Seven". Restez à l'écoute pour un guide approfondi sur la mise à niveau de l'interface utilisateur vers Seven, offrant ainsi une expérience utilisateur optimale dans l'écosystème Drupal 10.