- WordPress :5.4
- Statut : non résolu
- Ce sujet contient 14 réponses, 4 participants et a été mis à jour pour la dernière fois par
marival, le il y a 3 mois et 3 semaines.
-
AuteurMessages
-
25 avril 2020 à 13 h 01 min #2340396
Bonjour,
Ma configuration WP actuelle
– Version de WordPress : 5.4
– Version de PHP/MySQL : 7.3.12 / 8.0.18
– Thème utilisé : Head Blog
– Thème URI : https://headthemes.com/theme/head-blog/
– Extensions en place : Forum_wordpress_fr (4.2)
– Adresse du site : http://localhost/wordpress
– Nom de l’hébergeur : Apache/2.4.41 (Win64) PHP/7.3.12Problème(s) rencontré(s) :
Je compte utiliser mon site pour publier des nouvelles. Celles-ci comportent des dialogues avec des tirets au début de chaque phrase, qui sont donc automatiquement convertis en liste avec des puces rondes et un retrait. Si je mets en paragraphe, les tirets sont supprimés.
Comment puis-je garder mes dialogues avec des tirets et sans retrait ?
Merci
29 juin 2020 à 12 h 09 min #2347684Salut,
Une solution serait de garder le format liste pour les dialogues mais d’y ajouter une classe pour pouvoir cibler cet élément et lui donner l’aspect désiré. exemple :
li.dialogue { list-style-type: '-'; padding: 0; margin: 0; }
5 juillet 2020 à 10 h 47 min #2348144Salut,
J’ai essayé de coller ton code
dans le CSS additionnel de personnaliser
et dans le CSS additionnel du bloc directement
mais pas d’effet sur ma liste. Je dois mal m’y prendre ?
Merci !
5 juillet 2020 à 11 h 23 min #2348147Bonjour, les tirets des dialogues ne sont pas les traits d’union du clavier “classique”, ce sont des tirets quadratins en typographie française et ne sont donc pas interprétés par WP en liste – https://www.aproposdecriture.com/regles-typographiques-du-dialogue . Il faut que vous trouviez un moyen de les utiliser, soit en copiant/collant le code HTML – https://fr.wikipedia.org/wiki/Tiret, en utilisant un logiciel d’autocomplétion (qui permet d’éviter de recopier à chaque fois le code) (je conseille Beeftext https://github.com/xmichelo/Beeftext), soit en apprenant le Bépo qui vous permet d’avoir accès simplement aux caractères typographiques français (voir mon billet là dessus https://www.li-an.fr/mon-travail/mes-zimages/ami-bepo/). Le billet vous donnera aussi des liens vers des claviers alternatifs pour accéder plus rapidement aux caractères spéciaux français.
L’extension WP-Typography va aussi bien vous aider à obtenir un texte bien formé en français https://www.echodesplugins.li-an.fr/plugins/typographie/
— Voilà un exemple de quadratin pas interprété par WP (merci Bépo)
6 juillet 2020 à 13 h 58 min #2348212As-tu bien donné la classe ‘dialogue’ à la liste ciblée?
Aussi, pour aller dans le sens de Li-an qui a tout à fait raison concernant le “tiret”, voici le code modifié avec un demi-cadratin à la place du “-“.
li.dialogue { list-style-type: '—'; padding: 0; margin: 0; }
8 juillet 2020 à 14 h 35 min #2348392Merci Li-An pour toutes ces informations. Très intéressant le BEPO !
Pour l’instant, j’utilise les tirets semi-quadratin du site https://www.w3schools.com/charsets/ref_utf_punctuation.asp
Jharrow, je joins une capture d’écran. J’ai ajouté le CSS, mais les puces restent. Je dois faire quelque chose de plus ?
Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.8 juillet 2020 à 14 h 44 min #2348394Désolé je n’ai pas été très précis. Voici l’exemple complet avec les demi-cadratins : https://jsfiddle.net/7sfk962a
8 juillet 2020 à 15 h 00 min #2348396Toujours pas. C’est peut-être ma manière de faire qui n’est pas juste. Je copie ton code et je le colle dans la case CSS additionnel des réglages du bloc, c’est juste ?
8 juillet 2020 à 16 h 21 min #2348412Rajoutez le plutôt dans Personnaliser (le thème) > CSS additionnel
14 septembre 2020 à 23 h 51 min #2353489Bonjour,
Je reviens sur cette discussion, au cas où vous n’auriez pas trouvé :
Je copie ton code et je le colle dans la case CSS additionnel des réglages du bloc, c’est juste ?
Oui, c’est juste, mais ce n’est que la 1/2 du travail. L’autre 1/2 consiste à insérer la class “dialogue” dans le HTML de votre contenu, afin que la liste visée possède la class qui ré-interprète la liste habituelle pour éviter les puces rondes.
Autrement dit, vous devez insérez votre liste en mode HTML (dans le contenu de publication, ou dans un bloc HTML), en ajoutant
.dialogue
à la baliseli
de début de liste.26 septembre 2020 à 11 h 20 min #2354629Bonjour,
Merci , j’ai essayé le .dialogue, mais j’ai un message qui dit contenu non valide (voir capture jointe)
J’ai aussi essayé avec le code de Jharrow, captures jointes également
Toujours pas de résultat
Merci !
Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.27 septembre 2020 à 0 h 22 min #2354673Ohlala, oui pardon ! C’est
<li class="dialogue">
qu’il faut utiliser dans le HTML27 septembre 2020 à 10 h 04 min #2354676Je progresse
avec
<ul class="dialogue">
sans css, j’obtiens déjà les tirets quadratins, il me reste juste à enlever le retrait (voir le premier bloc du fichier joint)mais quand j’ajoute le css de Jharrow, ça me remet les puces rondes !
J’ai également essayé d’introduire le
<ul class="dialogue">
dans le cas d’un dialogue au milieu d’un texte, ce qui est le plus souvent le cas, mais ça ne marche pas (message code invalide)Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.29 septembre 2020 à 20 h 01 min #2354898Je vous conseille de lire un peu sur le CSS, pour apprendre à l’utiliser. Si vous voulez mettre la class “dialogue” sur la balise de liste
<ul>
, alors il faut modifier le code de Jharrow par :ul.dialogue li { list-style-type: '—'; padding: 0; margin: 0; }
2 octobre 2020 à 15 h 31 min #2355157Super, merci beaucoup !
-
AuteurMessages
- Vous devez être connecté pour répondre à ce sujet.