A l'enregistrement du code, CKeditor n'en fait qu'à sa tête.

Réponses

• kowalsky Member

  janvier 2017

  désactive ckéditor, enregistre ton article, ré-active ckéditor ?
• fabrice0101 Member

  janvier 2017 janvier 2017 modifié

  Je te remercie d'avoir lu mon message.
  Bien trop contraignante, c'est assurément une solution que je n'utiliserai pas.
  Je cherche quelque chose d'un peu plus sérieux si je peux m'exprimer ainsi.
  
  EDIT: J'utilise la v5.5 de PluXml.
• kowalsky Member

  janvier 2017 janvier 2017 modifié

  Fallait tenter.
  
  Sinon, tu peux aussi insérer ton image en background dans une <div> vide avec une classe CSS spéciale, et en changer l'affichage avec le sélecteur :hover.
  
  dans la source de l'article :
  <div class="gifanime"></div>
  
  
  dans css/theme.css :
  .gifanime{
  width: 256px;
  height: 192px;
  background-image: url(monsite/data/images/static.gif);
  }
  
  .gifanime:hover {
  background-image: url(monsite/data/images/anim.gif);
  }
  
  
  
  /// Pour un aperçu rapide du résultat, on remplacera simplement le background-image par un background-color dans le CSS :
  .gifanime{
  background-color: blue;
  }
  .gifanime:hover {
  background-color: red;
  }
  
• fabrice0101 Member

  janvier 2017 janvier 2017 modifié

  Merci de t'être penché sur le problème, c'est très sympa
  Je découvre ton second message au moment où j'allais annoncer que je venais de trouver la solution.
  J'ai remarqué que ce tordu de CKeditor s'amusait à classer le code par ordre alphabétique au moment de l'enregistrement...
  Donc:

  [== HTML ==]
  src="monsite/data/images/static.gif" 
  

  se retrouve après:

  [== HTML ==]
  onmouseover="this.src='monsite/data/images/anim.gif';
  

  
  Ce qui fait que "This." n'a plus de sens...
  De là, je suis parti sur une autre approche, en faisant attention à l'enregistrement qui reclassera au final tout par ordre alphabétique. Et cela donne:

  [== HTML ==]
  <p onmouseout="i1.src='/data/images/static.gif'" onmouseover="i1.src='/data/images/anim.gif'"><img alt="" border="0" height="192" name="i1" src="/data/images/static.gif" width="256" /></p>
  

  
  Un code extrêmement court, autonome, sans CCS, qui permet d'être reproduit sur un même article autant de fois que j'ai une image à animer par un onmouseover. Mon article est maintenant terminé, il contient 10 images GIF statiques différentes qui, dès que je passe la souris dessus, basculent sur le GIF animé correspondant
  
  EDIT:
  
  Note: Dans l'exemple, "i1" correspond au nom que j'ai donné à la premier image ("i2" pour la seconde image à animer, "i3" pour la troisième, ...). On peut bien sûr nommer les images autrement, mais chaque image doit avoir un nom différent.
• Francis Member

  janvier 2017 janvier 2017 modifié

  J'ai trouvé une solution pour que CKEditor conserve l'ordre des attributs après enregistrement de la page.
  
  Dans plugins/ckeditor/ckeditor.php, il faut écrire avant la ligne 128,
  donc juste avant de l'accolade de fin de la boucle for(var i=0;i<textareas.length;i++) { ... }

  [== JavaScript ==]
  CKEDITOR.on('instanceReady', function(event) {
    event.editor.dataProcessor.writer.sortAttributes = false;
  });
  

  J'ai fait un essai avec ton code, pour moi ça marche.
  
  Edit : Cette fonction n'est pas documentée dans CKEditor, je l'ai trouvée dans ce forum : http://stackoverflow.com/questions/29019398/disable-sorting-of-element-attributes
  On peut aussi la tester ici : https://jsfiddle.net/4t72c4n1/6/
• fabrice0101 Member

  janvier 2017

  Merci beaucoup Francis!
  Je viens de faire un test et, effectivement, cela fonctionne très bien