diff options
author | polo <ordipolo@gmx.fr> | 2025-03-21 00:47:16 +0100 |
---|---|---|
committer | polo <ordipolo@gmx.fr> | 2025-03-21 00:47:16 +0100 |
commit | 141291c29306391f91e7ceee57ff4d6e9907ab1d (patch) | |
tree | 3896896e18f4c8d84c8108e1c80e3d8c7093e712 /installation dans une application PHP.txt | |
parent | 51a5391c96043829f7bbccda1262a51a8b8f93d8 (diff) | |
download | ckeditor5-master.zip |
Diffstat (limited to 'installation dans une application PHP.txt')
-rw-r--r-- | installation dans une application PHP.txt | 100 |
1 files changed, 0 insertions, 100 deletions
diff --git a/installation dans une application PHP.txt b/installation dans une application PHP.txt deleted file mode 100644 index 76ec201..0000000 --- a/installation dans une application PHP.txt +++ /dev/null | |||
@@ -1,100 +0,0 @@ | |||
1 | 1/ installation | ||
2 | |||
3 | cd "mon projet" | ||
4 | git clone git@ordipolo.fr:ckeditor5 | ||
5 | copier tout son contenu (sauf le .git) dans le dossier racine de notre application et supprimer le dossier source | ||
6 | rm -r ckeditor5 --interactive=never | ||
7 | attention quand un index.php existe déjà | ||
8 | |||
9 | les fichiers composer.json et package.json sont volontairement absents | ||
10 | faire un install (npm) et un require (composer) dans son projet, obtenir la dernière version de l'éditeur et essuyer les plâtres! | ||
11 | npm install ckeditor5 | ||
12 | composer require htmlawed/htmlawed | ||
13 | |||
14 | les fichiers récupérés par le git clone, src/integration/ckeditor5/ est à insérer dans son projet: | ||
15 | src/integration/ckeditor5/CKEditor.php | ||
16 | src/integration/ckeditor5/view.php | ||
17 | src/integration/ckeditor5/image_upload.php | ||
18 | src/integration/ckeditor5/articles_hors_editeur.css | ||
19 | installation dans une application PHP.txt | ||
20 | index.php (appel des contrôleurs) | ||
21 | data/page/html/1646148841.html | ||
22 | data/page/html/1646148842.html | ||
23 | data/page/images/chirurgien jaune.jpg | ||
24 | data/page/images/garfield4.png | ||
25 | |||
26 | |||
27 | 2/ lien symbolique nécéssaire pour trouver les traductions (commande pour debian): | ||
28 | un problème de chemin se produit à la ligne: import coreTranslations from 'ckeditor5/translations/fr.js'; dans lib/ckeditor5/template.php | ||
29 | gràce à un lien symbolique, le programme s'attend à trouver un dossier "translations" dans "browser" | ||
30 | |||
31 | PHP l'ajoute avec symlink dans index.php | ||
32 | si le lien symbolique /srv/http/ckeditor5/node_modules/ckeditor5/dist/browser/translations | ||
33 | n'a pas été créé correctement par PHP, permettre au serveur d'écrire dans "browser" ou le faire en BASH | ||
34 | la commande mklink permet de faire la même chose sur un serveur windows, l'option /J créée une jointure et fonctionne sans droit d'admin | ||
35 | |||
36 | chemin absolu | ||
37 | ln -s /var/www/ckeditor5/node_modules/ckeditor5/dist/translations /var/www/ckeditor5/node_modules/ckeditor5/dist/browser/ | ||
38 | chemin relatif | ||
39 | ln -s ../translations node_modules/ckeditor5/dist/browser/ | ||
40 | |||
41 | |||
42 | 3/ essai | ||
43 | les paramètres dans CKEditor.php et les fichiers dans data permettent normalement | ||
44 | - d'ouvrir l'éditeur | ||
45 | - de lire des données dans des fichiers et de les insérer dans l'éditeur pour modification | ||
46 | |||
47 | la sortie au "submit" est nettoyée puis se retrouve dans $html_from_editor | ||
48 | |||
49 | |||
50 | 4/ intégration à un projet | ||
51 | |||
52 | a) insérer le dossier: src/integration/ckeditor5/ | ||
53 | |||
54 | b) adapter les paramètres dans CKEditor.php, $storage_mode vaut soit 'files' soit 'database' | ||
55 | |||
56 | c) les autres fichiers sont un exemple pour y prendre du code, | ||
57 | => piocher dans index.php! | ||
58 | |||
59 | d) le dossier data et ses sous-dossiers ont besoin de droits en écriture | ||
60 | |||
61 | e) adapter la connexion à la BDD si nécéssaire | ||
62 | |||
63 | f) insérer dans chaque page affichant des données créées avec l'éditeur: | ||
64 | <?= $ckeditor->getCSSOutsideEditorTag() ?> | ||
65 | 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 | ||
66 | |||
67 | g) ajouter dans chaque page insérant l'éditeur: | ||
68 | <?= $ckeditor->getCSSEditorTag() ?> | ||
69 | |||
70 | |||
71 | ce qui suit est de l'information utile si on souhaite partir de zéro avec NPM et la doc | ||
72 | |||
73 | |||
74 | |||
75 | 5/ explication et choix des plugins | ||
76 | tout ça est déjà fait, mais vous pouvez toujours personnaliser l'éditeur en choisissant des plugins différents | ||
77 | |||
78 | voici ce que j'ai fait dans: lib/ckeditor5/template.php | ||
79 | |||
80 | a) créer une importmap avec les chemins des fichiers | ||
81 | <script type="importmap"> | ||
82 | { | ||
83 | "imports": { | ||
84 | "ckeditor5": "http://<?= $server_root ?>node_modules/ckeditor5/dist/browser/ckeditor5.js", | ||
85 | "ckeditor5/": "http://<?= $server_root ?>node_modules/ckeditor5/dist/browser/" | ||
86 | } | ||
87 | } | ||
88 | </script> | ||
89 | |||
90 | b) charger une liste de plugins façon python | ||
91 | import { "liste de plugins" } from "ckeditor5"; | ||
92 | |||
93 | c) rechoisir les plugins dans ClassicEditor.create(): | ||
94 | plugins: [ "liste de plugins" ] ... | ||
95 | |||
96 | d) choisir les élément de la toolbar | ||
97 | toolbar; { items: [ "éléments" ], ... | ||
98 | |||
99 | e) autres éléments: | ||
100 | toolbar des images et des tables, sécurité des envois AJAX | ||