Insertion d’images dans une zone texte en drupal 6.x avec WYSIWYG image upload et TinyMCE
Il est très pratique de pouvoir insérer des images dans une boîte de contenu plutôt que de passer par un champ CCK. Voici une façon simple d’y parvenir. J’ai décidé de le faire avec TinyMCE, mais le créateur du module d’insertion d’images affirme que cela fonctionne avec tous les éditeurs supportés par le module WYSIWYG.
Vous aurez besoin des modules drupal suivants :
- WYSIWYG (éditeur HTML)
- WYSIWYG image upload (ajoute la fonctionnalité à l’éditeur d’insertion d’images)
- jQuery Update (version 6.x-2.x-dev – une version plus récente de jQuery de celle qui est incluse pas défaut avec drupal)
- jQuery UI (inclut la possibilité de se servir des fonctionnalités de jQuery UI)
- jQuery UI Dialog (une boite de dialogue provenant de jQuery UI)
- imageAPI (permet la manipulation d’images)
- ImageCache (permet d’avoir plusieurs alternatives de grandeur d’image pour une seule image)
Au niveau PHP, vous aurez besoin de l’un des modules suivants pour permettre la manipulation d’images :
Pour commencer, vous aurez besoin d’un autre fichier, il s’agit de la version 1.7.2 de jQuery UI. Il faut ensuite extraire le fichier .zip dans le répertoire du module jquery_ui. Renommez le dossier jquery-ui-1.7.2 pour jquery.ui. Normalement, tous les sous dossiers de jquery-ui (demos, docs, external etc…) doivent se retrouver sous …modules/jquery_ui/jquery.ui/.
Ensuite, il vous faut TinyMCE, la version « main package ». Il faut extraire ce fichier .zip sous /sites/all/libraries/, de sorte que le fichier tiny_mce.js se retrouve a cet emplacement : /sites/all/libraries/tinymce/jscripts/tiny_mce/tiny_mce.js. Vous pouvez ensuite procéder à l’installation de tous les modules. Le choix de cet éditeur reste personnel et une fois le module WYSIWYG installé, vous pourrez en choisir un autre de votre choix. Je ne peux confirmer que l’insertion d’images fonctionnera par contre.
Activez maintenant tous ces modules…
Sous administer > site configuration > wysiwyg, il faut éditer les profils ‘filtered HTML » et « full HTML ». Dans la configuration du profil sous lequel vous voulez l’insertion d’images, dans buttons et plugins, activez image uploading (normalement dans les derniers boutons). N’oubliez pas d’éditer les fonctionnalités pour chaque profil sinon, des paramètres par défaut seront utilisés. Vous pourrez maintenant insérer des images en cliquant sur
dans l’éditeur pour ajouter une image à partir d’une boite de dialogue. Vous pouvez installer aussi (si ce n’est déjà fait) le « image browser » qui vient avec WYSIWYG image upload et qui permet de garder une librairie d’images que l’on peut réutiliser !
Et voilà, bonne insertion d’images !