HTML e exibição
O conteúdo salvo deve continuar legível fora do editor e sem assinatura.
Formato persistido
| Item | HTML salvo | O que preservar |
|---|---|---|
| Fórmula | <math data-latex="…">…</math> | MathML para leitura e data-latex para reedição. |
| Conta / resolução | div.conta-armada, tabelas, texto e MathML | data-conta com JSON quando presente; estilos inline e estrutura. |
| Gráfico / desenho | <img> com PNG | src, alt, dimensões e data-grafico ou data-quimica. |
| Fórmula química | <math data-quimica="…"> | MathML, LaTeX e JSON de configuração. |
| CKEditor / Tiptap | span/div[data-formulix] | Wrappers e filhos sanitizados; Tiptap também permite JSON. |
No TinyMCE, a representação durante a edição usa .eqx[data-mathml]; ao salvar, o adaptador produz MathML portátil. Não confunda o elemento temporário com o formato persistido. O LaTeX fica em data-latex porque o sanitizador do TinyMCE 8 remove semantics/annotation.
<math xmlns="http://www.w3.org/1998/Math/MathML" data-latex="x^2">
<msup><mi>x</mi><mn>2</mn></msup>
</math>Exibir para o aluno
Renderize o HTML salvo com o tratamento seguro da plataforma. Navegadores modernos exibem MathML; tabelas e imagens não precisam do Formulix para leitura. PNGs precisam continuar acessíveis no armazenamento da plataforma. Remover metadados pode manter a aparência, mas impedir reedição.
Para navegadores antigos, o projeto recomenda MathJax 3. Hospede os arquivos ou carregue o componente abaixo na página de leitura, conforme o guia oficial do MathJax 3. O exemplo usa CDN externa: avalie CSP e privacidade ao carregar recursos de terceiros.
<script defer
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
</script>Para conteúdo acrescentado dinamicamente, execute MathJax.typesetPromise([elemento]) quando o MathJax estiver pronto. O Formulix não precisa ser carregado na página do aluno.
Sanitização e acessibilidade
Preserve somente elementos e atributos necessários com regras explícitas no sanitizador. Não desabilite a sanitização de HTML não confiável. Confira MathML, tabelas, estilos e metadados no ciclo salvar/reabrir. Drupal alpha tem restrição específica de Full HTML.
Mantenha texto alternativo das imagens. MathML ajuda tecnologias assistivas, mas não substitui testes com o editor, navegador e leitor de tela usados pela escola.