style balise <pre>

Le Bechec · 08/09/2011 16:54:46

Bonjour,

je cherche à rajouter un style <pre> mais je n'y arrive pas vraiment...

J'ai ajoute dans edition-styles.xml :

(J'ai aussi modifié le fichier i18n)

dans content.css :

.mceContentBody pre,
#jsn-mainbody pre {
font-weight:bold;
color:navy;
font-family:arial;
}

dans ametysv3-layout.css :

pre {
font-weight:bold;
color:navy;
font-family:arial;
}

dans backoffice-buttons.css:
.htmleditor-pre {
color:#808080;
font-size:0.9em;
font-style:bold;
}

Après rafraîchissement, je vois bien dans l'éditeur le nouveau style, je peux l'appliquer mais quand je valide, le contenu entier de la balise disparaît. Il manque quelque chose quelque part ?

Merci pour votre aide.

Raphaël Franchet · 08/09/2011 17:03:55

oui
Tout ce que vous avez fait permet d'ajouter un style dans l'éditeur en ligne.
MAIS car il y a un mais...

Ametys ne stocke pas en HTML mais dans un format pivot : le docbook.
Il faut donc intervenir sur la conversion de contenu htmleditor => docbook pour sauver tout ça
+ sur la conversion docbook => htmleditor pour ré-éditer tout ça
+ sur la conversion docbook => html pour la visualisation

Par contre, c'est automatiquement géré pour les balises h1 à h6 et p... et c'est plutot ça qu'on a tendance à faire.
Est-ce que pourriez utiliser une classe sur un p (facile) ? ou voulez vous vraiment générer un <pre> (complexe) ?

Le Bechec · 08/09/2011 17:09:30

J'ai bien essayé avec 1 balise <p> mais je n'ai pas réussi (enfin, je n'ai pas trouvé comment le faire ?) à mettre en place un rendu comparable à la balise <pre>. Le but poursuivi est de pouvoir citer du code perl, php,.. correctement. Nous voulons migrer de la doc. interne (en provenance de dokuwiki) vers Ametys. Si vous avez une solution, je suis preneur !

Raphaël Franchet · 08/09/2011 17:19:17

si le but est de garder les retours à la ligne du code, vous avez la propriété CSS "white-space: pre". Mais vu que vous passez par l'éditeur en ligne, ça doit transformer en BR
si le but est de donner un rendu de code, il suffit de choisir une police à chasse fixe comme "courier new" dans votre CSS

dernière solution : mettre une pastille html expert...

Le Bechec · 09/09/2011 07:59:24

La solution de la pastille html expert est lourde à mettre en place je trouve. Je vais regarder la solution "complexe". Concernant la doc sur ce sujet, tout se trouve la ? ( et Pas d'autres exemples ?

Last edited by Le Bechec (09/09/2011 08:04:34)

Raphaël Franchet · 09/09/2011 09:39:44

Et la solution CSS, qu'en pensez-vous ? elle me paraît satisfaisante non ?

Le Bechec · 09/09/2011 10:41:59

j'ai bien essayé avec la propriété "white-space: pre" mais sans succès concernant l'indentation qui n'est pas conservée après validation dans l'éditeur ?

J'ai mis :
resources/css/ametysv3-layout.css

p.pre {
white-space: pre;
font-weight:bold;
color:navy;
font-family:arial;
}

dans conf/edition-styles.xml

et dans resources/css/content.css
.mceContentBody p.pre,
#jsn-mainbody p.pre {
white-space: pre;
font-weight:bold;
color:navy;
font-family:arial;
}

Raphaël Franchet · 09/09/2011 10:51:57

Arial n'est pas une police à chasse fixe : les i prennent peu de place et le m prennent plus de place.
Essayez avec Courrier plutôt.

Le Bechec · 09/09/2011 11:06:31

même résultat. Quelque chose comme cela :
"{
id => "people",
allow_null => 0,
hideempty => 1,v
menus => [
{
fields => [ "creators_name" ],
new_column_at => [1, 1],
mode => "sections",
open_first_section => 1,
group_range_function => "EPrints::Update::Views::cluster_ranges_30",
grouping_function => "EPrints::Update::Views::group_by_a_to_z",
},
],
order => "-date/title",
variations => [
"type",
"DEFAULT",
],
},

devient :

{
id => "people",
allow_null => 0,
hideempty => 1,v
menus => [
{
fields => [ "creators_name" ],
new_column_at => [1, 1],
mode => "sections",
open_first_section => 1,
group_range_function => "EPrints::Update::Views::cluster_ranges_30",
grouping_function => "EPrints::Update::Views::group_by_a_to_z",
},
],
order => "-date/title",
variations => [
"type",
"DEFAULT",
],
},

Pas top. Il faudra donc nous en contenter ! Dommage.

Raphaël Franchet · 09/09/2011 11:11:40

mais au moment du "coller" l'indentation est tjrs là ?
c'est après sauvegarde qu'elle disparait ?

Le Bechec · 09/09/2011 11:15:52

Oui exactement !

Dans l'éditeur (même sans avoir appliqué de style d'ailleurs), l'indentation est correcte mais dès que l'on sauvegarde l'indentation disparaît. Le style p.pre s'applique bien pourtant après sauvegarde.

Raphaël Franchet · 09/09/2011 11:19:30

c bizarre et peut-être un bug... (qui aurait alors lieu même si vous faisiez la solution complexe d'implémenter vraiment avec pre)

Le Bechec · 09/09/2011 13:15:08

Je me demande si ce comportement n'est pas du à la conf de l'éditeur TinyMCE ? Est-il possible de modifier/surcharger la conf. initiale ?

Raphaël Franchet · 09/09/2011 13:51:42

je ne pense pas, mais au niveau conf on a customisé ça au petits oignons le risque de conflit serait donc grand
vous avez le nom de l'option en tête ?

Le Bechec · 09/09/2011 14:24:14

j'ai vu ceci :

Le Bechec · 13/09/2011 09:02:46

Bonjour,

Pas de solution donc ?

Raphaël Franchet · 13/09/2011 09:28:26

Vous pouvez tenter de le faire mais il va falloir tester à mon avis, car cela risque de casser pas mal de choses

Pour tester facilement, voici ce que vous pouvez faire :
1) vous ouvrez un contenu en édition et vous le refermez aussitot : cela initialise tinymce
2) vous ouvrez firebug et dans la console vous ajouter votre paramètre en intervenant sur "tinyMCE.settings" : tinymce.setting.preformated = "true";
3) vous éditez un nouveau contenu, normalement votre settings est pris en compte

Si cela fonctionne comme vous le souhaitez, on cherchera une solution pour l'intégrer à votre projet

Forum Ametys

#1 08/09/2011 16:54:46

style balise <pre>

#2 08/09/2011 17:03:55

Re: style balise <pre>

#3 08/09/2011 17:09:30

Re: style balise <pre>

#4 08/09/2011 17:19:17

Re: style balise <pre>

#5 09/09/2011 07:59:24

Re: style balise <pre>

#6 09/09/2011 09:39:44

Re: style balise <pre>

#7 09/09/2011 10:41:59

Re: style balise <pre>

#8 09/09/2011 10:51:57

Re: style balise <pre>

#9 09/09/2011 11:06:31

Re: style balise <pre>

#10 09/09/2011 11:11:40

Re: style balise <pre>

#11 09/09/2011 11:15:52

Re: style balise <pre>

#12 09/09/2011 11:19:30

Re: style balise <pre>

#13 09/09/2011 13:15:08

Re: style balise <pre>

#14 09/09/2011 13:51:42

Re: style balise <pre>

#15 09/09/2011 14:24:14

Re: style balise <pre>

#16 13/09/2011 09:02:46

Re: style balise <pre>

#17 13/09/2011 09:28:26

Re: style balise <pre>

Board footer