Découvrez notre nouvel éditeur, pour une écriture sur Discourse plus facile que jamais

[lindsey (Lindsey Fogle)]

L’un de nos principaux projets cette année a été de développer un nouveau mode d’édition de texte enrichi pour le compositeur, ce qui rend l’écriture sur Discourse plus familière et intuitive. Le nouveau compositeur est disponible ici sur Meta et en tant que paramètre expérimental depuis un certain temps, mais nous sommes arrivés au point où nous sommes ravis de supprimer le label expérimental et d’inviter votre communauté à l’essayer !

Dans ce sujet, nous en dirons plus sur le compositeur, son fonctionnement et comment vous pouvez le rendre disponible dans votre communauté en quelques clics.

Un nouvel éditeur de texte enrichi pour Discourse

Le nouvel éditeur de texte enrichi simplifie l’expérience d’écriture pour les utilisateurs de Discourse, en particulier ceux qui sont moins technophiles ou qui ne sont pas familiers ou à l’aise avec l’écriture en Markdown. L’éditeur de texte enrichi prend en charge le Markdown, ainsi que d’autres raccourcis clavier courants et des ajustements de formatage de la barre d’outils, mais le formatage est rendu immédiatement pour une expérience WYSIWYG (« ce que vous voyez est ce que vous obtenez ») similaire à des outils familiers comme Google Docs et Notion.

L’avenir du Markdown

Nous savons que de nombreux utilisateurs de Discourse aiment le compositeur Markdown actuel et apprécient son expérience d’écriture prévisible et simple. Le nouvel éditeur est un “mode” compositeur qui se trouve aux côtés du mode Markdown existant, afin que vous et vos membres puissiez choisir le style d’écriture qui vous convient le mieux.

La plupart des choses que vous faisiez dans le compositeur Markdown classique sont désormais prises en charge dans l’éditeur de texte enrichi, notamment :

• Toutes les mises en forme de base, prises en charge en Markdown (**gras**), à l’aide de raccourcis clavier courants (Commande + B) et via les icônes de la barre d’outils.
  

  

• Prise en charge des fonctionnalités avancées comme la création de tableaux, la création de sondages, l’insertion de date/heure, l’ajout de sections “masquer les détails”, l’ajout de sections “flou spoiler”, le téléchargement de fichiers / images / vidéos, le rendu des liens en onebox, la mise en forme des mentions de catégories / tags / utilisateurs, la citation de contenu et l’insertion de notes de bas de page.

• Interface utilisateur de lien dédiée pour visiter, modifier, copier, titrer ou supprimer des liens
  

  

• Interface utilisateur d’image dédiée pour redimensionner, légender ou supprimer des images
  

  

Cependant, il y a certains domaines sur lesquels nous travaillons encore, comme faciliter l’édition de tableaux et de sondages. Nous continuerons à travailler à la parité des fonctionnalités entre les modes compositeurs, et nous vous encourageons à partager des demandes de #fonctionnalités concernant les fonctionnalités et capacités qui vous importent le plus pour nous aider à prioriser notre travail. En attendant, vous pouvez toujours revenir au mode Markdown pour répondre à vos besoins avancés.

Comment nous l’avons construit

Notre implémentation s’appuie sur l’excellent ProseMirror et son module Markdown non essentiel, en utilisant le schéma, l’analyse et les définitions de sérialisation du module comme base pour d’autres fonctionnalités spécifiques à Discourse.

Activer le nouveau compositeur

L’éditeur enrichi est activé par défaut pour toutes les communautés. Lorsque vous ou vos membres ouvrez le compositeur, vous remarquerez une bascule dans la barre d’outils. Cela vous permet de basculer entre le mode classique uniquement Markdown et le nouvel éditeur de texte enrichi.

---

Mise à jour : si vous préférez que vos membres voient le compositeur Markdown par défaut :

@\"lindsey

Nous avons récemment ajouté un nouveau paramètre qui vous permet de contrôler quel éditeur est affiché par défaut dans votre communauté : Choisir le mode compositeur par défaut pour votre communauté

[volanar]

Excellente nouvelle. Y a-t-il une fonctionnalité dans la feuille de route qui est déjà présente dans tous les éditeurs enrichis ? Le texte en couleur ? Étant donné que Markdown ne prend pas en charge le texte en couleur, cela peut être réalisé à l’aide d’extensions CSS. Alternativement, il peut y avoir d’autres options dont nous ignorons l’existence.

[Jonathan5]

@lindsey

recherchez Rich editor. Vérifiez le paramètre pour l’activer

Y a-t-il un paramètre pour choisir l’éditeur par défaut après cela ? Merci.

[sam (Sam Saffron)]

@Jonathan5

Existe-t-il un réglage pour déterminer quel éditeur est le défaut après cela ? Merci.

Pas encore, mais nous prévoyons d’en ajouter un.

[Kartoon]

Lorsque vous appuyez sur le bouton « taille du texte » (qui ne semble pas être là sur ce site mais il l’est sur le mien), vous obtenez cette erreur

Je ne vois pas non plus l’« interface utilisateur d’image » dans la publication ?

[MarkDoerr]

@lindsey

Interface d’image dédiée pour redimensionner, légender ou supprimer des images

J’attendais avec impatience l’option de mise à l’échelle des images et j’adore la simplicité de celle-ci !

[awesomerobot (Kris)]

@Kartoon

ce qui ne semble pas être ici sur ce site mais c’est sur le mien

c’est une personnalisation qui devrait être mise à jour pour être compatible avec le nouvel éditeur, peut-être utilisez-vous un composant de thème comme Composer Button Bonanza ? (il y en a probablement d’autres)

@Kartoon

Je ne vois pas non plus l’“interface utilisateur d’image” dans la publication ?

avez-vous récemment mis à jour Discourse ? si oui, vous devez cliquer sur l’image dans le compositeur pour la voir

[sam (Sam Saffron)]

Je pense que cela pourrait être le plugin bbcode officiel, je me souviens qu’il contenait toutes sortes de choses comme la prise en charge des couleurs et de la taille

[alltiagocom (Tiago)]

Mes suggestions :

1. J’aime écrire en markdown (peut-être que je m’y suis habitué ?), mais lorsque j’utilise la version markdown, je n’aime pas la nouvelle police monospace, donc pour moi, cela n’a pas de sens d’inclure l’éditeur riche dans ma communauté (puisque je serai probablement celui qui écrit le plus). Cela dit, cela pourrait être un paramètre qu’un utilisateur pourrait activer/désactiver. Par exemple, si je le désactive, j’obtiens toujours uniquement la version markdown, donc je conserve la police “normale” (pas la monospace). Si je l’active, alors j’obtiens ce qui a été implémenté. En tant qu’administrateur, je peux l’activer pour la communauté, mais chaque utilisateur pourrait l’activer/désactiver. Ou alors, chaque utilisateur pourrait décider quelle police utiliser dans la version markdown.
2. Je trouve cela un peu distrayant que lorsque l’éditeur riche est activé, tout le compositeur est redimensionné et déplacé. Surtout si je vais utiliser les deux versions de manière interchangeable (je sais que je le ferai), avoir la fenêtre qui se redimensionne chaque fois que je clique sur le bouton bascule me semble distrayant. Je comprends qu’avec l’éditeur riche, nous n’avons pas besoin du panneau de prévisualisation supplémentaire à droite, mais quand même… cet espace pourrait-il être utilisé pour autre chose ?
3. Ce n’est qu’un détail mineur, mais si le redimensionnement doit rester, il semble étrange que le compositeur soit aligné au milieu de la page, mais par rapport à la zone du sujet, il n’est pas aligné et donc il semble décalé à mes yeux :

Je ne suis toujours pas convaincu que j’utiliserai cette fonctionnalité, pour être honnête. Je peux voir comment elle pourrait éventuellement être utile, mais pour le moment, j’ai toujours cette sensation “d’irritation” chaque fois que je pense à l’utiliser.

[JonLewit]

Un utilisateur a essayé du code HTML et il n’a pas été rendu en mode WYSIWYG - tout ce qui s’est passé est que le texte HTML a été mis dans une boîte. Lorsque vous revenez au markdown, vous voyez le résultat correct dans le panneau d’aperçu. Est-ce censé montrer les résultats du HTML ou faut-il revenir au markdown pour un aperçu ? par exemple.

---

Article Wiki en construction

Veuillez permettre au créateur de travailler dessus comme il le peut. Vous êtes libre d'offrir de l'aide ou des conseils en répondant, mais veuillez ne pas le modifier sans permission.

---

`

[renato (Renato Atilio)]

C’est intentionnel, la prise en charge du HTML complexe se fait uniquement via le bloc HTML “passthrough”, comme vous l’avez vu.

<hr>
<h2 style="color:red;">Article du Wiki en cours de création</h2>
<p>Veuillez permettre au créateur de travailler dessus à son rythme. Vous êtes libre d'offrir de l'aide ou des conseils en répondant, mais veuillez ne pas le modifier sans permission.</p>
<hr>

Étant donné que le style est supprimé par le nettoyeur, pourquoi ne pas simplement écrire ceci ?

---
## Article du Wiki en cours de création

Veuillez permettre au créateur de travailler dessus à son rythme. Vous êtes libre d'offrir de l'aide ou des conseils en répondant, mais veuillez ne pas le modifier sans permission.
---

[TomoftheFog (Tom)]

J’ai testé le nouveau compositeur sur notre forum et je l’aime beaucoup, mais lors des tests, j’ai rencontré un comportement étrange dont je ne sais pas s’il est intentionnel ou non.

Lorsque vous citez quelqu’un en utilisant l’ancien éditeur, la mise en page est correcte et le curseur apparaît sous la citation :

Cependant, soit en utilisant le nouveau par défaut, soit en le modifiant lors de la composition d’une réponse, le curseur saute automatiquement à la fin du texte cité :

Si vous tapez quoi que ce soit, cela compte dans la citation et en essayant de répondre, l’erreur de publication apparaît :

Si c’est par défaut, nous pouvons en informer nos utilisateurs, je voulais juste m’assurer s’il s’agit du nouveau comportement lors de la citation d’utilisateurs avec le nouvel éditeur.

Merci.

[renato (Renato Atilio)]

Ce n’est pas intentionnel, nous avons une tâche interne pour améliorer ce comportement en particulier.

[Don]

Bonjour Merci, c’est plutôt cool

J’ai remarqué que cela ne prenait pas encore en charge le wrap [wrap]Hello[/wrap] et j’ai reçu ce message lorsque j’ai essayé de l’utiliser.

Token type wrap_open not supported by Markdown parser

[renato (Renato Atilio)]

Je ne pense pas qu’il y ait de plan pour prendre en charge un nœud « wrap » générique, à quoi cela ressemblerait-il ? Juste un div ?

Ou y a-t-il un \[wrap=quelque chose\] que vous prévoyez d’utiliser avec le nouveau compositeur ?

[Ethsim2 (Ethan)]

où avez-vous vu ce message d’erreur ? Mon instance supprime simplement le BBcode

---

@Don

[wrap]Hello[/wrap]

---

devient

---

Hello

[Don]

Nous utilisons certains composants de thème comme Discourse Icon et Discourse Stickers.

Je pense que je peux créer le composant autocollant sans enveloppe car il est juste pour la cible et ajouter du style à l’autocollant.

@Ethsim2

où avez-vous vu ce message d’erreur ?

Collez-le dans la partie Éditeur de texte enrichi ou passez du côté Markdown si vous l’avez collé là-bas.

[Ethsim2 (Ethan)]

@Don

@Ethsim2

où avez-vous vu ce message d’erreur ?

Collez-le dans le côté Éditeur de texte enrichi ou basculez du côté Markdown si vous l’avez collé là-bas.

je n’obtiens pas l’erreur, mais le BBcode reste là. Il n’y a pas d’aperçu sur le bureau, lorsque l’éditeur de texte enrichi est sélectionné

---

c’était sur le hash de commit de Discourse dernière version +269

et

hash de commit BBcode 1fbff6b1

[renato (Renato Atilio)]

Cela fonctionne comme prévu, le BBCode tapé est intentionnellement échappé (= affiché sous forme de texte) s’il n’est pas encore reconnu/implémenté, ce qui est le cas.

[Jagster (Jakke Lehtonen)]

@alltiagocom

Je n’aime pas la nouvelle police monospace

Est-ce que cela fonctionnerait pour vous :

.d-editor-container .d-editor-textarea-wrapper textarea.d-editor-input {
    font-family: var(--font-family);
}