Accueil du site > Rédaction > Assistants de rédaction > CKeditor > CKeditor 3.0

CKeditor 3.0

4 octobre 2009 – par Frédéric Bonnaud – 883 <blink style='color:red;'>public|spip|ecrire:commentaires</blink>

154 votes

CKeditor est l’évolution de l’éditeur WYSIWYG : FCKeditor, avec ce plugin vous pourrez utiliser cet éditeur à la place de l’éditeur de spip tout en laissant le choix à vos auteurs de l’éditeur qu’ils préfèrent utiliser.

Attention : cet éditeur WYSIWYG risque de détruire la belle charte graphique de votre site, ainsi qu’empêcher la mise à jour simplifiée de celle-ci. Avec ce plugin, le déplacement de votre site nécessitera l’édition manuelle de chaque article contenant des liens internes si vous déplacez votre site dans un autre répertoire.

Ceci devient totalement faux si vous préservez la typographie spip

Introduction

Le plugin est intégré complètement à SPIP. Si vous avez opté pour laisser le choix aux auteurs (c’est l’option par défaut). Il suffit de cliquer sur le lien adapté pour passer de l’éditeur spip à CKeditor.

Description

Que fait le plugin ?

Ce plugin remplace l’éditeur par défaut de spip (en particulier le porte-plume disparaît) dans les articles, les brêves et les rubriques par CKEditor un éditeur WYSIWYG.

Avec cet éditeur, vous pouvez :

continuer d’utiliser le mécanisme de spip pour insérer des images, des documents à/dans un article, une rubrique ...
insérer simplement des liens vers les objets standards de spip (mais aussi ceux non encore prévu en modifiant assez simplement le code du plugin : ajout d’un fichier, ajout d’un lien dans un autre) via un dialogue de CKEditor.
utiliser les balises spip non gérée par CKEditor comme vous le feriez depuis l’éditeur de spip.
utiliser des polices en utilisant le mécanisme CSS3 (@font-face), soit en utilisant le webfonts directory de google, ou en téléchargeant la police ainsi que la feuille de style CSS3 tel que générée par Font Squirrel par exemple dans le répertoire : IMG/FontKits/<répertoire de la police>/.
le plugin essaie, dans la mesure du possible de sauvegarder vos mises en page en utilisant les raccourcis typographiques de spip (le gras, l’italique, les liens, les ancres, les insertion d’images, de documents, les listes, ... ) mais beaucoup de choses sont sauvegardées au format html (les tableaux, les enrichissement sophistiqué : couleurs, polices etc ...).
(nouveau) utilisez CKEditor avec les crayons, ou les champs extra2
(nouveau) utilisez les modèles SPIP de manière ’visuelle’
(nouveau) utilisez des modèles d’articles que vous définirez
(nouveau) préservez la typographie spip
plein d’autres choses ...

Installation

Dans tous les cas, il faut qu’un répertoire lib existe à la racine de votre installation Spip pour que Spip puisse y copier la librairie CKeditor. Et il faut que Spip puisse écrire dans ce répertoire : c’est un pré-requis obligatoire.

Ensuite, vous pouvez installer le plugin de deux manières différentes :

Par FTP

Téléchargez le plugin :


Plugin CKEDITOR pour SPIP

Vous pouvez préférez la version de développement qui se trouve là

Décompresser l’archive où vous voulez, copier le répertoire entier dans le sous répertoire plugins de votre installation spip.

En mode auto

Créez un répertoire auto dans le sous répertoire plugins de votre installation spip. Taper/Copier l’url du plugins Validez. Spip télécharge l’archive et vous montre ce qu’il y a dedans. Validez.

Activation du plugin

Utilissez le gestionnaire de plugins Spip pour activer le plugin.

Ouvrez le répertoire plugins/auto et activez CKeditor pour Spip Validez. Spip n’est pas content : Normal, il faut encore télécharger CKeditor lui-même. Cliquer sur le bouton Télécharger. Après le téléchargement qui prend un certain temps (près de 5Mo ...), Spip vous montre le contenu de l’archive qu’il vient de télécharger : Procéder à l’installation : Normalement à ce stade, le plugin est installé. Il arrive, je ne sais pas pourquoi que spip ne copie pas le contenu de CKeditor au bon endroit, dans lib/ckeditor. Chez moi, il laisse l’archive décompressée dans tmp/cache/chargeur/ckeditor. En l’effaçant complètement et en recommençant, ça a marché. Je pense que le bug vient de spip. Mais je n’en suis pas sûr.

Modules complémentaires

Pour profiter pleinement de toutes les fonctionnalités du plugin, il faut installer aussi :

le plugin Itérateurs
la librairie html2spip
la librairie KCFinder dans /lib

Configuration

Puis on utilise l’interface CFG pour configurer le plugin. Ce n’est pas obligatoire mais les choix par défaut risquent de ne pas vous plaire.

Vous pouvez consulter les articles :

Incompatibilités

Ce plugin est incompatible avec le plugin Multilang.

ChangeLog


ChangeLog de la dernière version de développement

SVN

N’hésitez pas pas à essayer la dernière version disponible sur le SVN du projet :

version packagée
pour la dernière version utiliser svn :
- svn checkout http://ckeditor-spip-plugin.googlecode.com/svn/trunk/ ckeditor
- https://code.google.com/p/ckeditor-...

P.-S.

L’utilisation de ce type d’éditeur WYSIWYG permet difficilement de maintenir une charte graphique cohérente. Prévenez vos rédacteurs de limiter le recours aux enrichissements trop exotiques, ou mieux : limitez l’utilisation dans ce plugin l’accès aux seules fonctions de l’éditeur que vous souhaitez leur offrir.

Vos commentaires

0 | 10 | 20 | 30 | 40 | 50 | 60 | 70 | 80 | ... | 230

# Le 8 février à 10:54, par Gilles En réponse à : CKeditor 3.0

Bonjour
J’utilise ckeditor et son plugin pour deux sites différents (mais pas tant que ça, seul le contenu varie, l’architecture, la version de spip, les plugins installés et l’hébergeur ovh sont les mêmes).

Jusqu’à présent, tout fonctionnait à merveille (bravo aux concepteurs au passage) sur l’un des deux sites.
Mais depuis quelques jours, patatras, je soupçonne une mise à jour d’un plugin via la fonction auto du couteau suisse qui ne plait pas...
Si j’ai réussi à rétablir la barre d’outils ckeditor sur l’un des deux sites, l’autre ne veut rien savoir. J’ai supprimé le plugin (et ck dans le /lib) par ftp, vidé le cache, réinstallé...rien. J’ai essayé avec une version moins récente du plugin (la 768), rien...HELP !!

Configuration utilisée :
SPIP 2.1.12
CKEditor plugin 0.15-795 + CKEditor 3.6
CFG 1.16
plus quelques autres...la liste sur demande...

Un grand merci d’avance pour vos réponses.

Répondre à ce message
# Le 17 janvier à 11:36, par Arnaud En réponse à : CKeditor 3.0

Bonjour
j’ai installé CKeditor, c’est (presque) super !
je e comprends pas pourquoi, à chaque modification/enregistrement de l’article sont générés des balises vides type

 <title></title>     <title></title> 

j’ai essayé sans succès de chercher des solutions sur les post précédents…merci d’avance pour vos retours

Répondre à ce message
# Le 29 novembre 2011 à 15:04, par SES-Sterling En réponse à : CKeditor 3.0

Bonjour,
J’utilise CKeditor avec la librairie HTML2Spip cela fonctionne bien excepté les puces (le caractère « - » en particulier). Quand je passe de Ckeditor au code spip et inversement après chaque « - » l’éditeur rajoute un « Â ». Quelqu’un a t-il rencontré ce problème, y a t-il une solution ?
- # ^ Le 1er décembre 2011 à 14:34, par Frédéric Bonnaud En réponse à : CKeditor 3.0
  
  c’est un problème d’encodage : html2spip semble ne fonctionner que si la base est en utf8
- # ^ Le 1er décembre 2011 à 17:08, par SES-Sterling En réponse à : CKeditor 3.0
  
  Merci pour ta réponse je vais convertir la base (une idée d’un outil le faisant sous spip ?)
- # ^ Le 9 janvier à 13:43, par SES-Sterling En réponse à : CKeditor 3.0
  
  Malgré la bascule en utf8 de la base le problème persiste. J’ai essayé en forçant l’utilisation de CKeditor (option « CKeditor uniquement » dans la config) mais lors de la modification d’articles existant le problème est toujours présent.
  
  Personne n’aurait une autre piste ?
Répondre à ce message
# Le 20 décembre 2011 à 12:23, par Billard_fm En réponse à : CKeditor 3.0

Bonjour

je rencontre un problème avec l’éditeur. En effet j’utilise le plugin formidable pour des formulaire et pour introduire ce code

de mon formulaire je dois désactivé l’éditeur CKeditor.

Cependant si je retourne pour une correction ce code de formulaire disparaît après la correction.
Peut être est ce dans la configuration de l’éditeur au niveau des balises autorisées dans SPIP ?

Cordialement

François-Marie BILLARD
- # ^ Le 20 décembre 2011 à 13:54, par Billard_fm En réponse à : CKeditor 3.0
  
  Bon j’avance mais je butte sur ceci :
  
  dans la configuration avancée de CKEditor, je n’arrive pas a mettre dans les balises autorisées de spip
  
  p>
  merci
  
  F.M BILLARD
Répondre à ce message
# Le 7 décembre 2011 à 10:16, par Gerard FONTAINE En réponse à : CKeditor 3.0

Bonjour,

J’utilise ckeditor version 3.6 avec le plugin spip version 0.15 r751
Je suis en modification d’article
Je clique sur le bouton « Source »
Je modifie ou non le code
Je clique à nouveau sur « Source » pour revenir à l’affichage normal ; à partir de là plus aucun outil des barres n’est accessible.

Y a-t-il une explication ou une solution ?

Cordialement,
GeF

Répondre à ce message
# Le 25 novembre 2011 à 15:54, par alex En réponse à : CKeditor 3.0

J’ai un soucis qui semblerai provenir de ce plugin lorsque je veux changé le statut des articles.
Voici le post sur le forum de spip ou j’explique le problème :

http://forum.spip.org/fr_239374.html#rep

D’apres ce que j’ai vu cela proviendrait d’un soucis au niveau du callback pour le chargement de ckeditor lors de requete ajax.
- # ^ Le 26 novembre 2011 à 08:43, par Frédéric Bonnaud En réponse à : CKeditor 3.0
  
  Ça ressemble à une boucle infinie d’appels récursifs. Mais je ne vois pas à quel moment un appel récursif est fait.
- # ^ Le 26 novembre 2011 à 11:18, par alex En réponse à : CKeditor 3.0
  Oui tous à fait d’accord.
  C’est bizarre, pour l’instant j’ai commenté la ligne et tous marche nickel :
  
  //.($cpt_ajaxload?"\n if(typeof onAjaxLoad == 'function') onAjaxLoad(loadCKEditor);":'')
  
  => D’ailleurs CKeditor fonctionne toujours (même dans un article lorsque l’on switch entre lui et typo spip) .
  
  A priori le callback loadCKEditor est lancé quand l’on passe sur la vignette de statut de l’article au moment du chargement (ajax) des puces, le soucis (je crois) c’est que le callback n’a pas lieu de se lancer/activé sur cette requete ne comportant pas de textarea.
  Et là (dans loadCKEditor() ) :
  « $(this).attr(’id’) ; : could not call function attr() of undefined »
  => a peu près je n’ai pas le code sous les yeux.
  
  Et la, "je pense que", c’est à cause de la précédente erreur que la boucle sur _confirm() arrive.
  Enfin c’est ce que j’ai constaté.
- # ^ Le 1er décembre 2011 à 14:36, par Frédéric Bonnaud En réponse à : CKeditor 3.0
  
  ce qui ne doit pas fonctionner c’est : avec les crayons ou le plugin qui permet la saisie sans passer par le bouton modifier etc...
Répondre à ce message
# Le 23 novembre 2011 à 15:39, par Franck En réponse à : CKeditor 3.0
Bonjour
Je crois qu’il y a un bug avec les images.

Je souhaites ajouter une image à un article, je le télécharge depuis mon ordi via le systeme de spip en cliquant sur « Parcourir », le fichier se telecharge correctement.
Dans le cadre à gauche, je choisi

<img 112|center>

en l’écrivant via CTRL + V dans mon article !

Le problème, c’est que l’image n’apparait pas dans mon article, à la place, j’ai un petit icone (image casser), pourtant, si j’enregistre mon article, l’image apparait bien dans l’article publique !

Une idée du problème ?
- # ^ Le 24 novembre 2011 à 12:45, par Frédéric Bonnaud En réponse à : CKeditor 3.0
 
 Avez-vous essayer la dernière version du plugin (celle qui est disponible uniquement via le SVN) ? Avec cette version, je n’ai pas ce problème.
- # ^ Le 24 novembre 2011 à 18:22, par Frédéric Bonnaud En réponse à : CKeditor 3.0
 
 Voilà : la version 797
- # ^ Le 24 novembre 2011 à 19:14, par Franck En réponse à : CKeditor 3.0
 
 Merci !!!
 
 Alors j’ai une super bonne nouvelle et une super mauvaise :-D
 
 La bonne, maintenant, cela fonctionne concernant les images :-)
 
 Par contre, concernant les couleurs, cela ne fonctionne plus :-(
 
 Je tape un texte
 exemple :
 le soleil est rouge
 
 Je mets le texte en surbriance et je choisie la couleurs rouge, mon texte change effectivement de couleur, mais dès que je clique sur « enregistrer », le texte passe en noir :-(
 
 Pareil, si je souhaite centrer le texte, le texte ce centre bien, par contre dès que je clique sur « enregistrer », le texte s’aligne à gauche :-(((
 
 merci de votre aide ! :-)
- # ^ Le 24 novembre 2011 à 19:27, par Franck En réponse à : CKeditor 3.0
 
 A savoir que j’ai essayer en vidant le cache, supprimer et réinstaller le plug et les librairie
 
 pour info :
 Quand je cliques sur enregistrer après avoir centrer le texte (rien d’autre)
 Cela affiche :
 [| Le soleil est rouge |]
 
 Par contre, quand je change la couleurs (uniquement ça)
 Cela affiche :
 Le soleil est rouge
 
 Rien de plus, pas |] contrairement au centrage
 
 Le problème semble venir de l’option « conversion complète en typographie SPIP » car si je la coche, cela me fait ses problème, par contre, si je ne la coche pas, mais que je clique sur « réinnitialiser le plugin », dans l’onglet « avencée » cela fonctionne :-)
- # ^ Le 25 novembre 2011 à 08:21, par Frédéric Bonnaud En réponse à : CKeditor 3.0
 
 La conversion en typo spip supprime effectivement les couleurs : ce n’est pas possible en typo spip (standard) de spécifier de couleur.
- # ^ Le 25 novembre 2011 à 11:26, par Franck En réponse à : CKeditor 3.0
 
 Ok, merci de la réponse :-)
Répondre à ce message
# Le 8 octobre 2011 à 18:59, par mm En réponse à : CKeditor 3.0

Bonjour,

Je viens de mettre à jour le plugin pour spip ckeditor, téléchargé ici, ckeditor 3.6.2 et il y a un bug qui n’était pas sur la version précédente. Qd j’écris l’article et que j’insère une image en tant que document spip, donc avec l’icone de la configuration de départ du plugin, l’image s’intègre et je la vois ds le formulaire. Elle apparait aussi ds l’article. Mais dès que je veux modifier l’article, l’image disparait. En regardant les proriétés de l’image qui n’apparait plus, une croix à la place, je constate que dans le chemin, il manque un morceau.
Au lieu de http://monsite/IMG/jpg, ckeditor indique qu’il cherche l’image ici http://monsite/jpg.
Quelle est donc l’erreur, svp ? l’erreur n’apparait qu’à la modification et pas dans l’article lui-même.
Merci d’avance
- # ^ Le 10 octobre 2011 à 17:58, par kite33 En réponse à : CKeditor 3.0
  
  j’ai mis en place le plugin mais j’aimerai pouvoir garder la gestion des images pour le mécanisme de spip. Or dans mon article aprés avoir telepcharger mon image par Spip, coller n’affiche pas l’image.
  J’ai du raté un paramètre dans la configuration du plugin
  Merci pour votre aide
  LG
- # ^ Le 13 octobre 2011 à 22:59, par Frédéric Bonnaud En réponse à : CKeditor 3.0
  
  pour mm : il me faudrait savoir quel mode de conversion du utilise (CFG->Configuration de CKEditor -> avancé)
  
  pour kite33 : je ne comprends pas ta question.
- # ^ Le 16 octobre 2011 à 16:34, par ? En réponse à : CKeditor 3.0
  
  Bonjour,
  
  configuration avancée de ckeditor.
  Balises SPIP à autoriser dans CKEditor : docXX ;embXX ;imgXX
  
  Options de conversion :
  conversion partielle en typographie SPIP
  
  Balises HTML que HTML2SPIP doit laisser intouchées : vide
  
  J’ai installé la librairie html2spip.
  L’image disparait uniquement en modification, pas à la création. Bizarre, non ?
  le code source de l’article : il met juste le code de spip pr l’image
  
  J’intègre les images en tant que document de spip.
  J’ai fait un test en cochant"aucune conversion. Là c’est catastrophique, j’ai au moins 100 lignes de codes html générées pr un article sans rien dedans.
  Sur le même serveur, je n’avais pas ces pbs avec une version antérieure du plugin ( celle de mai 2011 environ).
  Merci d’avance pour la réponse.
  Oubli de signature : mm
- # ^ Le 26 octobre 2011 à 11:35, par seb En réponse à : CKeditor 3.0
  
  bonjour,
  
  je rencontre le même problème que mm.
  dernière version de la lib ckeditor, du plugin et de spip installé (téléchargé ce matin)
  j’ai fait quelques tests en modifiant les option avancées sans succès :(
- # ^ Le 16 novembre 2011 à 11:40, par Kevin En réponse à : CKeditor 3.0
  il faut corriger un bug, je suppose que ca doit être un oubli de la part du develloppeur, dans la fonction qui traite les images spips enfin d’après ce que j’ai compris du code.
  
  Fichier : spip/plugins/ckeditor-spip-plugin/inc/ckeditor_tools.php
  Ligne 178 :
  Avant :
  
  $row['fichier'] = url_absolue($row['fichier']) ;
  
  Après :
  
  $row['fichier'] = url_absolue(_DIR_IMG.$row['fichier']) ;
  
  celà rajoutera le dossier des images (par default : IMG/) dans le path de l’image.
- # ^ Le 20 novembre 2011 à 10:01, par Frédéric Bonnaud En réponse à : CKeditor 3.0
  
  Merci pour ce fix, je l’ajoute de suite à la version de développement (disponible sur le svn)
Répondre à ce message
# Le 14 novembre 2011 à 18:01, par ben350ci En réponse à : CKeditor 3.0

Bonjour,
est ce que cette version peut être installée sur un spip 1.9.1 ?
Merci de votre aide
- # ^ Le 18 novembre 2011 à 21:35, par Fred En réponse à : CKeditor 3.0
  
  A priori : non, cette version utilise trop de spécificité de spip 2.x
Répondre à ce message
# Le 26 octobre 2011 à 02:51, par Cécile En réponse à : CKeditor 3.0

Il semblerait que la dernière version de CKEditor que je viens de télécharger soit incompatible avec SPIP-Listes : lorsque CKEditor est activé il est impossible de générer un nouveau courrier dans SPIP-Listes (lettre vide), tout se passe bien dès que je désactive CKEditor.
- # ^ Le 26 octobre 2011 à 09:39, par Frédéric Bonnaud En réponse à : CKeditor 3.0
  
  Tu peux peut-être regarder dans les log de spip si spip-listes dit qu’il y a un pb à la génération de la lettre.
Répondre à ce message

0 | 10 | 20 | 30 | 40 | 50 | 60 | 70 | 80 | ... | 230

Répondre à cet article

Qui êtes-vous ?

Nom [Se connecter]
Courriel (non publié)

Pour afficher votre trombine avec votre message, enregistrez-la d'abord sur gravatar.com (gratuit et indolore) et n'oubliez pas d'indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )

Texte de votre message

Ajouter un document

gif, jpg, png

SPIP-Contrib

CKeditor 3.0

Introduction

Description

Installation

Configuration

Incompatibilités

ChangeLog

SVN

P.-S.

Rubriques

Derniers commentaires

Compatibilité

Téléchargement(s)

CKeditor

Sur le Web

Vos commentaires

Répondre à cet article

Ça discute par ici

Thélia

MediaBox

Navigation AJAX

Squelettes IENSP-X version Pleine Page pour SPIP 2.1

Balise #CAPTCHA

Ça spipe par là

SPIP Blog

SPIP Party

SPIP Forums

SPIP-Zone

SPIP SVN