Étiquette : TinyMCE

[Magento 2] Astuces d’utilisation et de configuration de TinyMCE

Astuces d’utilisation de TinyMCE dans Magento 2

TinyMCE supprime les icônes Font Awesome (les balises <i> vides)

Source: 2.3 – WYSIWYG Editor removes <i> tag.

Solution: mettre un commentaire afin que le tag ne soit pas vide <i class="fa fa-gamepad"><!-- icon --></i>.

Surcharger la configuration de TinyMCE dans Magento 2

Ajouter le support d’un élément HTML que TinyMCE supprime/efface par défaut

Nous allons ajouter le support de l’élément HTML <marquee> dans TinyMCE. Pour ce faire, nous allons surcharger le fichier /vendor/magento/module-backend/view/adminhtml/templates/widget/form/element.phtml dans app/design/adminhtml/Sodifrance/pdv/Module_Backend/templates/widget/form/element.phtml (ou Sodifrance/pdv sont les Vendor/theme).

[Magento][TinyMCE] Customizer les settings du WYSIWYG

Le fichier setup de TinyMCE est localisé dans js/mage/adminhtml/wysiwyg/tiny_mce/setup.js.

Dans ce fichier, repérer la variable var settings = { :

Les lignes suivantes pourront être ajoutées à ces variables pour :

Modifier le Doctype

[entity_encoding] Eviter que les caractères accentués (é, è, à, etc…) soient transformés en entités HTML (é, è, etc…)

Si la boutique est entièrement en UTF-8, cette fonction peut être désactivée en éditant la configuration de tinyMCE. Ajouter la ligne :

Source, documentation officielle de TinyMCE : http://www.tinymce.com/wiki.php/Configuration:entity_encoding, [Résolu] TinyMCE et accents.

[valid_elements]

Source, documentation officielle de TinyMCE : valid_elements.

[extended_valid_elements] Etendre le champ des balises et attributs HTML valides

Ajouter des paramètres pour éviter que TinyMCE ne supprime certaines balises vides.
Très embêtant lorsqu’on cherche, par exemple, à exploiter une police d’icônes dans un bloc statique. Le code HTML suivant est, par défaut, automatiquement supprimé :

Pour pallier à ce souci, ajouter la ligne suivante :

Source, documentation officielle de TinyMCE : http://www.tinymce.com/wiki.php/Configuration:extended_valid_elements.

[valid_children] Etendre le champ des balises HTML enfants valides

Permettre, par exemple, l’imbrication d’un H1 dans un A (pratique désormais permise en HTML5).

Source, documentation officielle de TinyMCE : http://www.tinymce.com/wiki.php/Configuration:valid_children.

[force_br_newlines][force_p_newlines] Gestion des retours chariot et du formatage des paragraphes

Supprimer le comportement qui consiste à créer un nouveau paragraphe à chaque retour chariot saisi par l’utilisateur backoffice.

Source, documentation officielle de TinyMCE : http://www.tinymce.com/wiki.php/Configuration:force_p_newlines, http://www.tinymce.com/wiki.php/Configuration3x:force_br_newlines.

[forced_root_block] Supprimer l’imbrication automatique du texte dans une balise P

Source, documentation officielle de TinyMCE : http://www.tinymce.com/wiki.php/Configuration3x:forced_root_block.

TinyMCE valid_elements setting for HTML5

  • Source Git : https://gist.github.com/veprbl/1136304
  • Fork le plus récent (code ci-dessous)(Last active on 20 Mar 2013) : https://gist.github.com/susebus/5204059