From 5b455dbf1474a3c7c839cd129fd470f1fdae6b0c Mon Sep 17 00:00:00 2001 From: polo Date: Sun, 27 Oct 2024 13:34:13 +0100 Subject: =?UTF-8?q?v2=20avec=20NPM=20et=20composer,=20customizable=20et=20?= =?UTF-8?q?plus=20facile=20=C3=A0=20int=C3=A9grer?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- installation dans une application PHP.txt | 95 +++++++++++++++++++++++++++++++ 1 file changed, 95 insertions(+) create mode 100644 installation dans une application PHP.txt (limited to 'installation dans une application PHP.txt') diff --git a/installation dans une application PHP.txt b/installation dans une application PHP.txt new file mode 100644 index 0000000..210902c --- /dev/null +++ b/installation dans une application PHP.txt @@ -0,0 +1,95 @@ +1/ installation + +cd "mon projet" +git clone git@ordipolo.fr:ckeditor5 +copier tout son contenu (sauf le .git) dans le dossier racine, attention quand un index.php existe déjà +rm -r ckeditor5 --interactive=never + +npm install ckeditor5 +composer require htmlawed/htmlawed + +les 11 fichiers récupérés par le git clone: +lib/ckeditor5/create.php +lib/ckeditor5/clean_html.php +lib/ckeditor5/view.php +lib/ckeditor5/image_upload.php +lib/ckeditor5/articles_hors_editeur.css +config.php +installation dans une application PHP.txt +index.php (appel des contrôleurs) +src/templates/page.php (HTML principal de la page web) +data/page/html/articles.html +data/page/images/chirurgien jaune.jpg + + +2/ à vérifier: +créer un lien symbolique comme ceci (commande pour debian): +ln -s /var/www/ckeditor5/node_modules/ckeditor5/dist/translations /var/www/ckeditor5/node_modules/ckeditor5/dist/browser/ + +ça régle un problème de chemin rencontré à la ligne: import coreTranslations from 'ckeditor5/translations/fr.js'; dans lib/ckeditor5/template.php +gràce à un lien symbolique, le programme s'attend à trouver un dossier "translations" dans "browser" + + +3/ essai +les paramètres dans config.php et les fichiers dans data permettent normalement +- d'ouvrir l'éditeur +- de lire des données dans des fichiers et de les insérer dans l'éditeur pour modification + +la sortie au "submit" est nettoyée puis se retrouve dans $html_from_editor + + +3/ intégration à un projet + +a) index.php et src/templates/page.php sont à remplacer en fonction de notre application +regarder à l'intérieur et adapter son propre code + +b) config.php est à personnaliser et/ou à copier ailleurs, +du moment que les variables à l'intérieur restent disponibles + +c) le dossier data et ses sous-dossiers ont besoin de droits en écriture + +a) adapter le routeur dans index.php + +b) adapter ce qui suit "// modèle" dans index.php et lib/ckeditor5/create.php pour obtenir les données souhaitées (BDD, fichiers) + +c) adapter le fichier config.php (vérifier les chemins) + +d) ajouter dans le +ajouter aussi dans le pour afficher l'éditeur ou du HTML créé par l'éditeur + +e) insérer dans chaque page affichant des données créées avec l'éditeur: + +l'éditeur ne génère pas de CSS mais seulement du HTML basique, ce CSS imite le rendu à l'intérieur de l'éditeur + +normalement c'est bon fini, ce qui suit est de l'information utile si on souhaite partir de zéro avec NPM et la doc + + + + + +5/ explication et choix des plugins +tout ça est déjà fait, mais vous pouvez toujours personnaliser l'éditeur en choisissant des plugins différents + +voici ce que j'ai fait dans: lib/ckeditor5/template.php + +a) créer une importmap avec les chemins des fichiers + + +b) charger une liste de plugins façon python +import { "liste de plugins" } from "ckeditor5"; + +c) rechoisir les plugins dans ClassicEditor.create(): +plugins: [ "liste de plugins" ] ... + +d) choisir les élément de la toolbar +toolbar; { items: [ "éléments" ], ... + +e) autres éléments: +toolbar des images et des tables, sécurité des envois AJAX -- cgit v1.2.3