Tiny MCE nouvelle version - classes et balises [Résolu]

Tiny MCE nouvelle version - classes et balises [Résolu] - Version imprimable

+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Modules, Tags (https://forum.cmsmadesimple.fr/forum-14.html)
+--- Sujet : Tiny MCE nouvelle version - classes et balises [Résolu] (/thread-3789.html)

Tiny MCE nouvelle version - classes et balises [Résolu] - guth - 10/03/2016

Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: ?
#~ Url du site :
#~ Hébergeur / Soft : OVH
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 2.1.2
#~ Installed Modules:
#~ AdminSearch: 1.0
#~ CMSContentManager: 1.1
#~ CMSMailer: 6.2.14
#~ DesignManager: 1.1.1
#~ FileManager: 1.5.2
#~ FormBuilder: 0.8.1.3
#~ MicroTiny: 2.0.3
#~ ModuleManager: 2.0.2
#~ Navigator: 1.0.2
#~ News: 2.50.4
#~ Search: 1.50.2
#~ TemplateExternalizer: 2.1.6
#~ TinyMCE: 3.1.2
#~ Config Information:
#~ php_memory_limit:
#~ max_upload_size: 64000000
#~ url_rewriting: mod_rewrite
#~ page_extension: .html
#~ query_var: page
#~ auto_alias_content: true
#~ locale:
#~ set_names: true
#~ timezone: Europe/Berlin
#~ permissive_smarty: false
#~ Php Information:
#~ phpversion: 5.4.45-0+deb7u2
#~ md5_function: On (Vrai)
#~ json_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_ALL: 22527
#~ E_STRICT: 0
#~ E_DEPRECATED: 0
#~ test_file_timedifference: Aucune différence de date du système trouvée
#~ test_db_timedifference: Aucune différence de date du système trouvée
#~ create_dir_and_file: 1
#~ memory_limit: 128M
#~ max_execution_time: 300
#~ register_globals: Off (Faux)
#~ output_buffering: 4096
#~ disable_functions: pcntl_alarm, pcntl_fork, pcntl_waitpid, pcntl_wait, pcntl_wifexited, pcntl_wifstopped, pcntl_wifsignaled, pcntl_wexitstatus, pcntl_wtermsig, pcntl_wstopsig, pcntl_signal, pcntl_signal_dispatch, pcntl_get_last_error, pcntl_strerror, pcntl_sigprocmask, pcntl_sigwaitinfo, pcntl_sigtimedwait, pcntl_exec, pcntl_getpriority, pcntl_setpriority, symlink, shell_exec, exec, proc_close, proc_open, popen, system, dl, passthru, escapeshellarg, escapeshellcmd
#~ open_basedir:
#~ test_remote_url: Valable
#~ file_uploads: On (Vrai)
#~ post_max_size: 64M
#~ upload_max_filesize: 64M
#~ session_save_path: /var/lib/php5 (1733)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ check_ini_set: On (Vrai)
#~ curl: On
#~ Performance Information:
#~ allow_browser_cache: On (Vrai)
#~ browser_cache_expiry: 60
#~ php_opcache: Off (Faux)
#~ smarty_cache: Off (Faux)
#~ smarty_compilecheck: Off (Faux)
#~ smarty_cache_udt: Off (Faux)
#~ auto_clear_cache_age: On (Vrai)
#~ Server Information:
#~ Server Software: Apache
#~ Server Api: cgi-fcgi
#~ Server Os: Linux 3.10.23-xxxx-std-ipv6-64 On x86_64
#~ Server Db Type: MySQL (mysqli)
#~ Server Db Version: 5.5.47
#~ Server Db Grants: Trouvé un privilège "GRANT ALL" qui semble être adapté
#~ Permission Information:
#~ tmp: /home/papillesenstock/www/tmp (0755)
#~ tmp_cache: /home/papillesenstock/www/tmp/cache (0755)
#~ templates_c: /home/papillesenstock/www/tmp/templates_c (0755)
#~ modules: /home/papillesenstock/www/modules (0755)
#~ uploads: /home/papillesenstock/www/uploads (0755)
#~ Masque de création de fichier (umask) : /home/papillesenstock/www/tmp/cache (0755)
#~ config_file: 0444
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour,

Sur les anciennes version de Tiny MCE, il était possible d'utiliser les classes figurant dans le css via le menu déroulant "Styles" de la barre d'outils.

Je n'ai pas retrouvé d'équivalent dans la nouvelle version, et l'ajout dans la configuration de la barre d'outils de "styleselect |" n'affiche qu'un menu "Format" qu'on peut retrouver dans la barre de menu.

Dans celle-ci, il y a la ligne "format: {title: 'Format', items: 'bold italic underline strikethrough superscript subscript | formats | removeformat'}" qui pourrait proposer l'affichage des classes, mais quelle serait la mention à ajouter (styleselect ne fonctionne pas) ?

Par ailleurs dans les pages, j'ai besoin d'insérer des listes à puce dont les item contiennent des balises span.

Code :
[== HTML ==]

<ul>

   <li><span></span></li>

</ul>

Je les intègre via "Outils > Code source", mais tiny MCE enlève systématiquement les balises span. Y a-t-il un moyen de garder la main sur le HTML ?

Je n'ai rien trouvé sur le site de Tiny MCE.

Merci de vos réponses

Tiny MCE nouvelle version - classes et balises [Résolu] - airelibre - 11/03/2016

Bonjour,

c'est dans l'onglet "css" : "Formats de style"

J'y ai mis un exemple :

Code :
title: 'Titre rouge', block: 'h2', classes: 'text-red'

C'est un peu plus complexe qu'avant, mais plus puissant.

Regarde aussi l'aide de ce champ, j'y ai indiqué le bouton à ajouter.

Pour les span, je ne suis pas sûr que tu puisses si Tiny à son niveau te les supprime. Cependant, il serait préférable et plus propre d'attribuer plutôt une classe sur le UL Wink

Tiny MCE nouvelle version - classes et balises [Résolu] - Jean le Chauve - 11/03/2016

Pour tes listes à puces, pourquoi ne pas utiliser un content block sans wysiwyg ?
Chaque terme serait séparé par un | (pipe). Ex.: test|essai|bonjour
Tu assignes la sortie (string) à une variable $termesPuce.

Code :
<head>

   [...]

   {content block='second' label="Termes de la liste à puces séparés par un pipe (|)" wysiwyg=false assign='termesPuce'}

   {share_data scope=parent vars='termesPuce' scope=global}

   [...]

</head>

<body>

   [...]

   <ul>

      {assign var="termes" value="|"|explode:$termesPuce}// on explode la string dans une array

      {foreach $termes as $terme}

      <li><span>{$terme}</span></li>

      {/foreach}

   </ul>

[...]

</body>

Si l'utilisateur a entré dans le bloc : "test|essai|bonjour"

Code :
<ul>

   <li><span>test</span></li>

   <li><span>essai</span></li>

   <li><span>bonjour</span></li>

</ul>

Tiny MCE nouvelle version - classes et balises [Résolu] - airelibre - 11/03/2016

Je pense qu'il veut pouvoir le placer où il veut dans le WYSIWYG

Je partirai plutôt vers un style prédéfini sur l'ensemble de la balise UL via le styleselect

Ou alors un gabarit externe

Tiny MCE nouvelle version - classes et balises [Résolu] - guth - 11/03/2016

@airelibre :

Excellent, je suis passé complètement à côté de ce champ dans l'onglet css ! l'utilisateur pourra retrouver de la marge de manœuvre dans l'édition. Au graphiste qui le coache de le convaincre de ne pas en abuser...

Le graphiste m'avait demandé des listes dont les puces sont colorées différemment, mais aussi la possibilité de colorer des parties de phrases dans les li. Impossible donc de faire une règle css générale au départ de ul sans passer par un span. Pour les puces, je passerai plutôt par un li::before en ayant supprimé le list-style-type de ul.

@Jean le Chauve :

C'est toujours un régal de lire tes interventions : tu n'imagines pas le nombre de solutions que j'ai pu trouver/appliquer après avoir lu tes posts, en particulier en ce qui concerne Smarty.

Celle-ci me sera également utile dans la mesure où on me demande aussi entre autres une liste inline avec des puces, qui ne sont normalement visibles qu'avec des li block.

Un grand merci à tous les deux.

Tiny MCE nouvelle version - classes et balises [Résolu] - airelibre - 11/03/2016

guth a écrit :Le graphiste m'avait demandé des listes dont les puces sont colorées différemment, mais aussi la possibilité de colorer des parties de phrases dans les li. Impossible donc de faire une règle css générale au départ de ul sans passer par un span. Pour les puces, je passerai plutôt par un li::before en ayant supprimé le list-style-type de ul.

Ok, dans ce cas vaut mieux ajouter un "span" dans la fameuse liste de styles que tu peux paramétrer, la styliser pour voir la différence dans l'éditeur, et enfin laisser le rédacteur choisir quel mot doit l'avoir.

Bonne continuation