HTML et affichage
Le contenu enregistré doit rester lisible hors de l’éditeur et sans abonnement.
Format conservé
| Élément | HTML enregistré | À préserver |
|---|---|---|
| Formule | <math data-latex="…">…</math> | MathML pour la lecture, data-latex pour la modification. |
| Calcul / résolution | div.conta-armada, tableaux, texte et MathML | data-conta avec JSON lorsqu’il existe, styles inline et structure. |
| Graphique / dessin | <img> avec PNG | src, alt, dimensions et data-grafico ou data-quimica. |
| Formule chimique | <math data-quimica="…"> | MathML, LaTeX et JSON de configuration. |
| CKEditor / Tiptap | span/div[data-formulix] | Conteneurs et enfants filtrés ; Tiptap permet aussi le JSON. |
Dans TinyMCE, la représentation pendant l’édition utilise .eqx[data-mathml] ; lors de l’enregistrement, l’adaptateur produit du MathML portable. Ne confondez pas cet élément temporaire avec le format conservé. Le LaTeX reste dans data-latex, car le filtre de TinyMCE 8 supprime semantics/annotation.
<math xmlns="http://www.w3.org/1998/Math/MathML" data-latex="x^2">
<msup><mi>x</mi><mn>2</mn></msup>
</math>Affichage pour l’élève
Affichez le HTML enregistré avec le traitement sécurisé de votre plateforme. Les navigateurs modernes affichent MathML ; tableaux et images n’ont pas besoin de Formulix pour être lus. Les PNG doivent rester accessibles dans le stockage de la plateforme. Retirer les métadonnées peut préserver l’apparence tout en empêchant la modification.
Pour les navigateurs anciens, le projet recommande MathJax 3. Hébergez les fichiers ou chargez ce composant dans la page de lecture selon le guide officiel de MathJax 3. L’exemple utilise un CDN externe : évaluez la CSP et la confidentialité lors du chargement de ressources tierces.
<script defer
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
</script>Pour du contenu ajouté dynamiquement, exécutez MathJax.typesetPromise([element]) une fois MathJax prêt. Il n’est pas nécessaire de charger Formulix sur la page de l’élève.
Filtrage HTML et accessibilité
Ne préservez que les éléments et attributs nécessaires, avec des règles explicites. Ne désactivez pas le filtrage du HTML non fiable. Vérifiez MathML, tableaux, styles et métadonnées après enregistrement et réouverture. Drupal alpha impose une restriction particulière de Full HTML.
Conservez les textes de remplacement des images. MathML aide les technologies d’assistance, mais ne remplace pas les tests avec l’éditeur, le navigateur et le lecteur d’écran utilisés dans l’établissement.