Dotclear

Vous n'êtes pas identifié(e).

Annonce

13 février 2024 Sortie de Dotclear 2.29

#1 2009-11-30 14:18:28

david-a
Membre
Inscription : 2009-10-09
Site Web

Texte préformaté <pre> : expliquez-moi

Bonjour

Lorsque je sélectionne mon texte et que je clique sur la balise "pré",
alors j'ai ceci dans mon billet :

///
voici mon texte
///

ce qui sur le blog place mon texte dans un petit rectangle bleu entouré de gris... C'est ça l'usage de préformaté ?
Ca me parait limité, il y a quelque chose qui m'échappe, non ?

On doit pouvoir en faire un autre usage, non ?

Merci


[ ici votre signature ]

Hors ligne

#2 2009-11-30 14:24:34

pierrevg
Membre
Inscription : 2005-04-13
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Bonjour,

En général, on l'utilise pour insérer du code plus long qu'une seule ligne sans qu'il soit interprété.
Tu peux styler son apparence depuis ta css.

Hors ligne

#3 2009-11-30 15:21:25

david-a
Membre
Inscription : 2009-10-09
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Merci,

J'ai trouvé ça dans le style.css, est-ce que c'est bien cette ligne qui correspond au bouton "pré" ?
Et si oui, comme j'ai remarqué qu'il n'y avait rien dans la création de billet pour centrer du texte,
est-ce que je peux décider que "pré" centre le texte ? Si oui, comment ?
Merci encore.

pre { width : 98%; overflow : auto; background : #e8f0ff; padding : 4px; border : 1px solid #aaa; }

[ ici votre signature ]

Hors ligne

#4 2009-11-30 15:30:49

patidou
Membre
Inscription : 2004-11-14
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Non <pre> sert à présenter du code... Si tu veux du texte centré, tu fais comme ça :

///html
<div style="text-align:center">
///

blalblabla
///html
</div>
///

«Quand j'étais petit, je voulais être maître du monde. Maintenant que je suis grand, j'arrive à peine à être maître de moi-même.» Le Chat/Philippe Geluk.
Dotclear a besoin de vous

Hors ligne

#5 2009-11-30 15:34:07

pierrevg
Membre
Inscription : 2005-04-13
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Bonjour,

Aucune idée si le code que tu donnes correspond exactement au <pre> du billet puisque nous n'avons aucune url pour vérifier... A priori, oui, mais sans aucune certitude donc. (c'est pourtant pas compliqué de donner une url...)

<pre> ne peut être parent que d'éléments en ligne, sauf <img />, <sub> et <sup>.

Hors ligne

#6 2009-11-30 15:34:25

osku
Membre
Lieu : 28
Inscription : 2005-06-15

Re : Texte préformaté <pre> : expliquez-moi

Pour éviter l'ascenseur horizontal (tout moche) dans les boites <pre>, tu peux essayer les règles suivantes :

pre {
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap important;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

Pour l'alignement du texte :

pre {
	text-align : center ; /* left | right | center, tu choisis :)*/ 
}

Mais j'ai envie de dire que le texte préformaté est seulement utilisé pour présenter du code..

Edit : Grillé par patidou, merci la prévisualisation :)

Hors ligne

#7 2009-11-30 15:52:48

david-a
Membre
Inscription : 2009-10-09
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Merci :)


[ ici votre signature ]

Hors ligne

#8 2011-10-02 23:06:15

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Bonjour,

J'utilise <pre></pre/> pour afficher de la poésie (eh oui, il n'y a pas que le code qui nécessite une certaine présentation !).

Seulement, il semble que dotclear ait des règles bizarres pour la gestion de cette balise.

Quand j'utilise &emsp; (qui est bien XHTML valid) voici ce qui se passe : je sauve mon billet, le contenu du billet est affiché en mode visuel et le caractère &emsp; est bien affiché comme un double espace. Si le billet est publié, l'espace apparaît également sur le site. Sauf que... je repasse en mode "source" et le caractère &emsp; a disparu !
En fait, le seul fait de passer du mode "source" au mode "visuel" et de revenir au mode "source" fait disparaître &emsp;.

L'option enable_html_filter est désactivée...

Bizarrement le caractère &nbsp; fonctionne bien.

Une explication ?

Hors ligne

#9 2011-10-03 05:24:20

patidou
Membre
Inscription : 2004-11-14
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Et tu l'utilise pourquoi le cadratin?

Sinon <pre> n'est pas vraiment fait pour ça, personnellement j'utiliserais un div englobant et des paragraphes normaux, avec des majuscules-retour pour le passage à la ligne.

<div class="poesie">

<p>blabla<br />
blabla<br />
blabla<br />
blabla<br /></p>

.…

</div>

Dernière modification par patidou (2011-10-03 06:15:43)


«Quand j'étais petit, je voulais être maître du monde. Maintenant que je suis grand, j'arrive à peine à être maître de moi-même.» Le Chat/Philippe Geluk.
Dotclear a besoin de vous

Hors ligne

#10 2011-10-03 07:37:35

Jean-Michel
Modérateur à ailes d'ange
Lieu : Paris
Inscription : 2006-08-22
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Bonjour,

Ged a écrit :

J'utilise <pre></pre/> pour afficher de la poésie (eh oui, il n'y a pas que le code qui nécessite une certaine présentation !).

Je viens de tester avec le premier poème de ton blog. Je rencontre pas de soucis.

Mon billet est édité en mode wiki, j'ai saisi ceci :

///
Qu’y a-t-il sur terre de plus beau
Que le chant d’une source, d’un oiseau,
Le gazouillis gentil d’un enfant,
///

Si je teste en mode billet en xhtml, Dotclear me génère ce que Patidou te donne en exemple.

Personnellement, je te conseillerai le mode wiki. C'est simple et sans contrainte d'interprétation.

Hors ligne

#11 2011-10-03 19:00:00

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

@patidou &emsp; n'est pas le tiret quadratin, c'est un espace double.

@Jean-Michel
J'ai testé le mode wiki et je n'obtiens pas le résultat recherché. En même temps, je ne connais pas trop bien le wiki :)

Exemple de formatage recherché :

AAAA       BBBB
CC           DDD

Malheureusement, les espaces multiples sont transformés en espace simple... et les tabulations &#9; ne sont pas reconnues (comme &emsp;, alors qu'il est bien XHTML valid dans <pre></pre>).

ET donc au final j'obtiens :

AAAA BBBB
CC DDD

Alors, XHTML ou wiki, pouvu que cela marche, je suis preneur d'une solution...

Hors ligne

#12 2011-10-03 19:14:33

Jean-Michel
Modérateur à ailes d'ange
Lieu : Paris
Inscription : 2006-08-22
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Ged a écrit :

Exemple de formatage recherché :

AAAA       BBBB
CC           DDD

Malheureusement, les espaces multiples sont transformés en espace simple... et les tabulations &#9; ne sont pas reconnues (comme &emsp;, alors qu'il est bien XHTML valid dans <pre></pre>).

Cela ressemble à un tableau (des lignes, des colonnes) donc utiliser les balises correspondantes. On peut aussi définir une liste <ul><li></li></ul> (c'est ce que j'ai fait pour un de mes sites).

L'important serait de définir toutes tes besoins dès le départ.

Hors ligne

#13 2011-10-03 20:30:15

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Eh bien s'il le faut je vais utiliser tout l'attirail HTML mais... l'utilisation de <pre></pre> eut été beaucoup plus simple. Il me semble que dotclear se plante un peu (beaucoup) dans la gestion de cette balise.

N'est-il pas possible de savoir comment dotclear gère cette balise (caractères et balises autorisés par exemple) ?

Également, pourquoi dotclear "nettoie" mon code alors que j'ai désactivé l'option enable_html_filter ? Please ?

Hors ligne

#14 2011-10-03 21:38:53

patidou
Membre
Inscription : 2004-11-14
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Ged a écrit :

@patidou &emsp; n'est pas le tiret quadratin, c'est un espace double.

J'avais bien compris. ;-) En fait, c'est une espace typographique : le cadratin, comme la fine, le demi-cadratin, etc.


«Quand j'étais petit, je voulais être maître du monde. Maintenant que je suis grand, j'arrive à peine à être maître de moi-même.» Le Chat/Philippe Geluk.
Dotclear a besoin de vous

Hors ligne

#15 2011-10-03 21:42:19

patidou
Membre
Inscription : 2004-11-14
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Sinon je suis aussi partisan des tableaux mais sans un exemple concret c'est dur d'en dire plus. ;-)


«Quand j'étais petit, je voulais être maître du monde. Maintenant que je suis grand, j'arrive à peine à être maître de moi-même.» Le Chat/Philippe Geluk.
Dotclear a besoin de vous

Hors ligne

#16 2011-10-03 22:20:33

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

@patidou Au temps pour moi ! En fait, j'ai utilisé le cadratin pour tester les caractères acceptés par la balise <pre> dans dotclear, qui semble ne gérer qu'un sous-ensemble de ceux autorisés par le W3C.

Et je n'aime guère les tableaux qui sont sur-employés, en HTML ou dans les traitements de texte. Il ne devrait pas être nécessaire de les utiliser pour formater du texte. J’essaierai avec des liste comme le préconisait Jean-Michel, mais je ne suis pas sûr de pouvoir obtenir le résultat recherché (cf. ex. précédent avec AAAA       BBBB).

Hors ligne

#17 2011-10-03 22:54:01

Jean-Michel
Modérateur à ailes d'ange
Lieu : Paris
Inscription : 2006-08-22
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Ged a écrit :

Et je n'aime guère les tableaux qui sont sur-employés, en HTML ou dans les traitements de texte. Il ne devrait pas être nécessaire de les utiliser pour formater du texte. J’essaierai avec des liste comme le préconisait Jean-Michel, mais je ne suis pas sûr de pouvoir obtenir le résultat recherché (cf. ex. précédent avec AAAA       BBBB).

Quelque soit l'outil utilisé grand public comme public averti, on ne dira jamais assez l'importance d'une bonne sémantique et balisage.

Je regarde demain matin pour t'expliquer ce que j'ai fait, rien de compliquer ;-)

Hors ligne

#18 2011-10-04 05:53:09

Philippe
Stagiaire
Lieu : Toulon
Inscription : 2004-06-13
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Ged a écrit :

Exemple de formatage recherché :

AAAA       BBBB
CC           DDD

C'est bien un tableau, ça, pourquoi chercher à obtenir cet effet avec une autre balise ?

Hors ligne

#19 2011-10-04 05:56:02

Mirovinben
M comme Mathusalem
Lieu : Dole (Jura)
Inscription : 2007-02-06
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Si le but est de formater le texte en deux colonnes, il vaudrait mieux s'orienter vers une solution basée sur deux div. Chacun affecté d'une classe qui lui est propre (genre duotextG pour la colonne de gauche et duotextD pour la colonne de droite avec, dans style.css ce genre de déclaration :

/*------------------------------------- 2 colonnes ----*/

div.duotextG{
  width: 49%;
  margin: 0;
  padding: 0;
  float: left;
}

div.duotextD{
  width: 49%;
  margin: 0;
  padding: 0;
  float: right;
}

.clear{
  clear: both;
}

La classe "clear" sera affectée à l'éventuel bloc/paragraphe suivant pour lui permettre de reprendre ses aises après les "float".

Exemple: dans ce billet de mon blog de test.

Extrait du code source du billet pour la zone concernée :

<div class="duotextG">
  <p>Quisque at dui a ante feugiat sodales. (...) Donec faucibus. </p>
</div>
<div class="duotextD">
  <p>Phasellus nisl mauris, dapibus non (...) nulla condimentum ipsum.</p>
</div>
<p class="clear">Fusce blandit.Nullam tellus ligula, (...) dictum enim sed odi&nbsp;:</p>

Hors ligne

#20 2011-10-04 20:30:49

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Merci à tous pour vos contributions.

@amalgame : j'aime la simplicité et <pre></pre> fait exactement ce que je veux (en XHTML je veux dire) avec seulement un clic sur pre dans dotclear pour afficher les deux balises puis en tapant le texte. Pourquoi créer un tableau ? Je suis le webmestre de ce site et la ou les autres personnes qui vont saisir n'en ont que faire du HTML.

@Jean-Michel ; totalement d'accord sur l'importance de la sémantique, et donc du balisage. Mais en l’occurrence il s'agit de mise en page de poème, pas d'article technique ou un CV par exemple. Et je recherche plus la simplicité de saisie que le référencement par un moteur de recherche.

@Mirovinben : je vais étudier ta solution, mais encore une fois cela ne tend pas vers la simplicité d'une saisie "brute" entre deux balises. Et deux colonnes flottantes ne peuvent pas assurer l'alignement entre les lignes des deux colonnes (que je sache), ce que je recherche - deux vers qui se répondent en l'occurence. AAAAA et BBBB doivent être sur la même ligne.

Pour résumer : <pre></pre> est parfait pour ce que je veux faire. Cela fonctionne, est simplissime et est valide en XHTML. Pourquoi dotclear casse-t-il ce fonctionnement ?

Hors ligne

#21 2011-10-05 08:08:25

Jean-Michel
Modérateur à ailes d'ange
Lieu : Paris
Inscription : 2006-08-22
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Effectivement, il va falloir regarder le pourquoi du comment, avec l'éditeur de Wordpress, ça ne le fait pas. Exemple ici.

Hors ligne

#22 2011-10-05 17:51:52

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Wordpress 15 / Dotclear 0 ;)

Hors ligne

#23 2011-10-05 22:22:10

alexpirine
Membre
Inscription : 2010-08-26

Re : Texte préformaté <pre> : expliquez-moi

Ged a écrit :

Bonjour,

J'utilise <pre></pre/> pour afficher de la poésie (eh oui, il n'y a pas que le code qui nécessite une certaine présentation !).

Seulement, il semble que dotclear ait des règles bizarres pour la gestion de cette balise.

Quand j'utilise &emsp; (qui est bien XHTML valid) voici ce qui se passe : je sauve mon billet, le contenu du billet est affiché en mode visuel et le caractère &emsp; est bien affiché comme un double espace. Si le billet est publié, l'espace apparaît également sur le site. Sauf que... je repasse en mode "source" et le caractère &emsp; a disparu !
En fait, le seul fait de passer du mode "source" au mode "visuel" et de revenir au mode "source" fait disparaître &emsp;.

L'option enable_html_filter est désactivée...

Bizarrement le caractère &nbsp; fonctionne bien.

Une explication ?

Il me semble qu'il n'y a pas réellement de problème pour &emsp;.

Je m'explique : tu as l'impression que &emsp; disparaît, mais en réalité, il est simplement converti dans le caractère (utf-8) correspondant.

Voici le caractère que je vois lorsque je fais Source -> &emsp; -> Visuel -> Source : " ". Remarque qu'il a une taille différente qu'un espace insécable " " ou un espace simple " ". Fais un copier-coller pour t'en assurer :)

Edit: désolé, le forum n'autorise pas les caractères utf. Mais en faisant la manip dans un éditeur qui affiche les bonnes longueurs des espaces, tu le remarqueras bien.

Dernière modification par alexpirine (2011-10-05 22:24:22)


Alex Pirine ~ 0xB936CB63F011A844 on pgp.mit.edu

Hors ligne

#24 2011-10-05 23:04:28

Ged
Membre
Inscription : 2011-09-17
Site Web

Re : Texte préformaté <pre> : expliquez-moi

@alexpirine Je viens de refaire quelques tests et c'est vraiment... pourri. Effectivement, &emsp; est remplacé par un espace quadratin et &#9; par une tabulation.
1ère remarque : difficile de voir ce que c'est en mode source puisque tous ces caractères sont affichés comme des espaces... Seul &nbsp; est affiché comme &nbsp; dans le source. Ce qui semble logique non ? C'est le source, pas le visuel. Je ne demande pas l'interprétation des caractères, je veux le source ; difficile d'éditer un texte dont certains caractères sont interprétés, pas d'autres.
2ème remarque :alors que &emsp; semble au moins fonctionner sur le site une fois publié, une série de &#09; est rendue comme un seul espace. ???!?!

Saisi dans source :

<pre>AAAAAAAA&emsp;BBB
CCCCC&emsp;&emsp;&emsp;DDDDDDD
EE&#09;&#09;&#09;FFFFF
GGG&nbsp;&nbsp;HHHHH
</pre>

Dans source après passage par visuel :

<pre>AAAAAAAA BBB
CCCCC   DDDDDDD
EE			FFFFF
GGG&nbsp;&nbsp;HHHHH              Seuls les &nbsp; subsistent en tant que tels
</pre>

Rendu sur le site :

AAAAAAAA BBB
CCCCC   DDDDDDD
EE FFFFF                                        Visiblement un seul espace
GGG  HHHHH

Copié colle du site dans ce commentaire :

AAAAAAAA BBB
CCCCC   DDDDDDD
EE			       FFFFF                    L'espacement correspond bien aux tabs et je compte trois caractère en passant dessus
 aGGG  HHHHH

Heu... quelqu'un a les règles de fonctionnement de <pre></pre> dans dotclear ? C'est pas très... clear :(

Hors ligne

#25 2011-10-06 07:09:12

Lomalarch
Responsable du photocopieur
Lieu : Colombes (92)
Inscription : 2006-05-02
Site Web

Re : Texte préformaté <pre> : expliquez-moi

Ged a écrit :

Également, pourquoi dotclear "nettoie" mon code alors que j'ai désactivé l'option enable_html_filter ? Please ?

En fait, il y a plusieurs « couches » dans l’éditeur visuel, dont une dépend du navigateur même. Une refonte est prévue de ce composant, mais, d’une part, ça prend du temps et, d’autre part, ça ne règle pas ton souci dans l’immédiat.

Dans ce type de cas très spécifique, tu obtiendrais probablement de meilleurs résultats en te passant entièrement de l’éditeur visuel. En le désactivant dans tes préférences utilisateurs, si tu veux continuer à éditer en XHTML ou en passant en mode wiki et en faisant tes inclusions html dedans. C’est paradoxal, mais je crois que le mode wiki est ce qui conserve le mieux le xhtml ;-)


RTFM attitude : https://fr.dotclear.org/documentation/2.0
Le chantier tips, tutos et astuces : http://tips.dotaddict.org/
Rien nulle part??? une petite recherche sul’ forum, alors?: https://forum.dotclear.org/search.php ?

Hors ligne

Vous n'êtes pas identifié(e).

Pied de page des forums

Sites map