JCE / TinyMCE - Continue de tenter de corriger le code HTML valide et non valide

9

De tous les éditeurs Joomla que nous avons utilisés, JCE a le mieux adapté à nos besoins et à nos clients. Mais il y a quelques problèmes avec l'éditeur qui peuvent causer des problèmes lorsque nous codons quelque chose, puis il est basculé sur wysiwyg et l'éditeur essaie de `` réparer '' notre html parfaitement valide.

Avant de poser des questions - oui, nous l'avons défini pour autoriser tous les éléments que JCE aime restreindre, et non, il n'est PAS défini pour valider / nettoyer le code html. Les seules restrictions que nous avons sont pour coller du contenu dans l'éditeur.

Pièce A:

<a href="#"></a>

Cela disparaîtra lors du basculement de l'éditeur et vice versa. Remplacé par:

<p>&nbsp;</p>

Pièce B:

<a id="#nameofanchor"></a>

Modifications apportées à:

<p>&nbsp;</p>

Pièce C:

<div><a id="#nameofanchor"></a></div>

Modifications apportées à:

<div>&nbsp;</div>

Pièce D:

<a id="hello" class="link">Hello</a>

Modifications apportées à:

<p><a id="hello" class="link"></a>Hello</p>

Pièce E:

<a href="#">
<div>
<h2>Our Work</h2>
</div>
</a>

Modifications apportées à:

<p><a href="#"></a></p>
<div>
<h2><a href="#">Our Work</a></h2>
</div>
<p>&nbsp;</p>

Maintenant, nous voulons utiliser id au lieu du nom pour notre ancre, car il est valide sous HTML5, alors que le nom ne l'est techniquement pas. De plus, dans quel univers est une affectation non valide à un lien?

De plus, maintenant qu'il est tout à fait légitime d'envelopper un div avec des liens, pourquoi JCE les supprimerait-il également?

Est-ce juste un paramètre qui me manque? Quelqu'un a-t-il une idée de la façon dont je peux utiliser l'éditeur pour que nous puissions coder comme nous en avons besoin dans l'éditeur, mais nos clients ne peuvent pas le détruire simplement en enregistrant dans wysiwyg?

Edit: j'ai testé cela dans Chrome, Firefox et Safari. Ne pensez pas que cela a quelque chose à voir avec le navigateur.

Edit: j'ai testé cela avec les paramètres du conteneur. Le conteneur de paragraphe et le paragraphe sur Entrée et le conteneur de division et Div sur entrée provoquent cela. Les deux autres, Aucun conteneur et paragraphe à l'entrée, Aucun conteneur et saut de ligne à l'entrée, ne le provoquent pas. Le problème est - j'ai besoin du premier réglage! Même s'il serait formidable de donner aux clients le bénéfice du doute, on ne peut tout simplement pas leur faire confiance pour suivre les instructions et ajouter une mise en forme de paragraphe à leur texte.

Confirmé: cela se produit également avec TinyMCE.

Donc - nous savons ce qui cause cela - le paramètre Conteneur de paragraphes - comment pouvons-nous le contourner tout en conservant ce paramètre en vie?

Faye
la source
1
Content que ce ne soit pas seulement moi.
Craig
Après nos discussions précédentes et la conclusion que cela vient de la fonction de wrapping d'élément JCE, je ne suis pas sûr de ce qui est réellement une préoccupation. Si vous faites confiance à votre client pour pouvoir ajouter des extraits HTML comme ci-dessus, en basculant l'état de l'éditeur, pourquoi ne lui ferez-vous pas confiance qu'il encapsulera son contenu avec les balises <p> appropriées?
FFrewin
Nos clients n'ajoutent pas de code HTML. NOUS écrivons html, ils utilisent le côté éditeur - dès que l'éditeur est basculé, cela détruit notre html parfaitement valide.
Faye
Dans tous les cas, si vous accordez au client un accès en modification à une page pleine de code HTML, d'une manière ou d'une autre, il y a de fortes chances que le client puisse détruire votre code HTML. Qu'en est-il de l'utilisation du gestionnaire de modèles de JCE, ou d'autres balises "macro", qui feront le sale boulot d'ajouter le balisage dont vous avez besoin?
FFrewin

Réponses:

7

J'utilise JCE Editor sur tous nos sites, mais nous avons également commencé à installer Sourcerer by NoNumbers. Cela donne un bouton INSERT CODE facile à l'éditeur JCE qui le protège de toute modification.

http://www.nonumber.nl/extensions/sourcerer

YellowWebMonkey
la source
MERCI. C'est parfait, nous avons déjà installé un numéro sur nos trucs parce que c'est fantastique, je ne savais pas qu'il avait ça. C'est parfait.
Faye
1
Il ne devrait pas être nécessaire d'utiliser Sourcerer pour ajouter du code HTML.
BodgeIT
Aaaand pourtant je dois, ou JCE supprime le HTML parfaitement valide.
Faye
2

Il existe des paramètres secrets pour JCE. Je sais que le paramètre suivant cesse d' &nbsp;être ajouté aux divisions vides, peut-être utilisé pour effacer les flottants, ce qui provoque des problèmes de hauteur de ligne lors du rendu:

In the Editor Global Configuration, add:
remove_div_padding:1 
to Custom Configuration Variables. 

Je m'attendrais à ce qu'il y en ait plus qui puissent contrôler n'importe quel aspect de l'éditeur.

BodgeIT
la source
1

Je pense que ce doit être les paramètres de typographie dans: Profil -> Paramètres de l'éditeur -> Typographie . Essayez de définir l'élément Container Element & Enter sur NoContainer & LineBreak sur Enter pour voir s'il applique toujours des modifications à votre code HTML.

Souvenez-vous également que le paramètre de validation HTML a un paramètre pour chaque profil de l'éditeur et que Joomla fournit également un filtre global dans la page de configuration globale définie par le groupe d'utilisateurs. Assurez-vous qu'il n'y a pas de paramètres pour chaque groupe d'utilisateurs.

FFrewin
la source
Oui, j'ai été dans tous les profils d'éditeur, etc. J'ai tout configuré correctement sans html. Changer le conteneur peut le résoudre - mais cela causera un autre problème, tout aussi problématique. Si un client peut ajouter du contenu texte qui n'est pas encapsulé dans des balises de paragraphe, la mise en forme de son texte sera différente. Nous n'en voulons pas non plus. Je vais le tester pour voir si cela cause le même problème avec l'ancre, mais en ce qui concerne les balises de paragraphe qui s'ajoutent, c'est une sorte de par pour le cours.
Faye
Oui, ce sont les paramètres du conteneur qui le font - mais comme je l'ai dit, c'est un problème plus important pour nos clients de ne pas pouvoir coller et avoir une balise de paragraphe automatique pour envelopper leur contenu.
Faye
Je pense que cela se produit parce que vos exemples de code contiennent des sauts de ligne, ce qui est une sorte de "règle" pour que JCE crée les paragraphes. Il devrait y avoir un tel critère pour cela. Votre client va-t-il coller de tels extraits HTML dans l'éditeur?
FFrewin
Nos clients n'utiliseront pas le HTML, mais nous codons toujours avec le HTML derrière ce qu'ils font. Nous créons des zones dans lesquelles ils peuvent coller / taper du contenu direct. Aussi - si vous voulez dire taper html sur une seule ligne au lieu d'organiser comme ci-dessus, j'ai également essayé. J'obtiens exactement les mêmes résultats.
Faye
0

Ce comportement n'est pas propre à JCE. TinyMCE se comporte de la même manière. Ce comportement peut ne pas être limité à TinyMCE, il peut s'agir d'un comportement DOM du navigateur.

JCE se donne en fait la peine d'essayer de garder des balises vides, la méthode utilisée est de remplir avec un espace.

https://github.com/widgetfactory/jce-editor/blob/master/editor/tiny_mce/plugins/cleanup/editor_plugin.js

Peter Wiseman
la source
Je ne vais pas mentir, je n'ai aucune idée de ce que cela signifie. Pouvez-vous le décomposer un peu plus? Qu'est-ce que je regarde dans ce lien? Que voulez-vous dire pad avec un espace? L'ajout d'un espace insécable aux exemples de code ci-dessus ne change pas les résultats finaux, je l'ai testé à fond.
Faye
J'ai basculé mon éditeur par défaut sur TinMCE, celui qui est pré-installé avec Joomla, et testé la pièce A. Il a également supprimé les balises lors du basculement entre l'éditeur WYSIWYG et les vues Source. ie Ce comportement ne semble pas être unique à JCE. Par conséquent, je me demande si ce n'est pas unique à TinyMCE non plus, et peut-être la même chose pourrait se produire lorsque vous utilisez la capacité des navigateurs pour effectuer une modification sur place. La référence du code JCE était la ligne 129 où un espace insécable est utilisé entre les balises de début et de fin. Cela fonctionne pour moi dans JCE et TinyMCE. Étrange.
Peter Wiseman