Presentazione del nostro nuovo composer, che rende la scrittura su Discourse più facile che mai

Uno dei nostri progetti principali quest’anno è stato lo sviluppo di una nuova modalità di editing di testo ricco per il compositore, che rende la scrittura su Discourse più familiare e intuitiva. Il nuovo compositore è disponibile qui su Meta e come impostazione sperimentale da qualche tempo, ma siamo giunti al punto in cui siamo entusiasti di rimuovere l’etichetta sperimentale e invitare la vostra community a provarlo!

In questo argomento, condivideremo maggiori informazioni sul compositore, su come funziona e su come renderlo disponibile nella vostra community con pochi clic.

:writing_hand: Un nuovo editor di testo ricco per Discourse

Il nuovo editor di testo ricco semplifica l’esperienza di scrittura per gli utenti di Discourse, in particolare per coloro che sono meno esperti di tecnologia o non sono abituati o a loro agio a scrivere in Markdown. L’editor di testo ricco supporta Markdown, oltre ad altre scorciatoie da tastiera comuni e modifiche di formattazione tramite la barra degli strumenti, ma la formattazione viene resa immediatamente per un’esperienza WYSIWYG («what you see is what you get», ciò che vedi è ciò che ottieni) simile a strumenti familiari come Google Docs e Notion.

:thought_balloon: Il futuro di Markdown

Sappiamo che molti utenti di Discourse amano il compositore Markdown attuale e apprezzano la sua esperienza di scrittura prevedibile e diretta. Il nuovo editor è una «modalità» del compositore che affianca la modalità Markdown esistente, quindi i vostri membri possono scegliere lo stile di scrittura che funziona meglio per voi.

La maggior parte delle cose che facevate nel compositore Markdown classico sono ora supportate nell’editor di testo ricco, tra cui:

  • Tutta la formattazione di base, supportata in Markdown (**grassetto**), tramite scorciatoie da tastiera comuni (Command + B) e icone della barra degli strumenti.

  • Supporto per funzionalità avanzate come la creazione di tabelle, sondaggi, inserimento di data/ora, aggiunta di sezioni «nascondi dettagli», aggiunta di sezioni spoiler offuscate, caricamento di file/immagini/video, rendering dei link come onebox, stilizzazione di menzioni di categoria/tag/utente, citazione di contenuti e inserimento di note a piè di pagina.

  • Interfaccia dedicata per i link per visitare, modificare, copiare, impostare il titolo o rimuovere i link

  • Interfaccia dedicata per le immagini per ridimensionare, aggiungere didascalie o eliminare le immagini

Tuttavia, ci sono alcune aree in cui stiamo ancora lavorando, come rendere più facile la modifica di tabelle e sondaggi. Continueremo a lavorare per raggiungere la parità di funzionalità tra le modalità del compositore e vi invitiamo a condividere #contribute:richieste di funzionalità su quali funzionalità e capacità sono più importanti per voi, per aiutarci a dare priorità al nostro lavoro. Nel frattempo, potete sempre tornare alla modalità Markdown per soddisfare esigenze avanzate.

:hammer: Come l’abbiamo costruito

La nostra implementazione si basa sull’eccellente ProseMirror e sul suo modulo Markdown non core, utilizzando lo schema, l’analisi e le definizioni di serializzazione del modulo come base per ulteriori funzionalità specifiche di Discourse.

:gear: Attivare il nuovo compositore

L’editor ricco è abilitato per impostazione predefinita per tutte le community. Quando voi o i vostri membri aprite il compositore, noterete un interruttore nella barra degli strumenti. Questo vi permette di passare dalla modalità classica solo Markdown al nuovo editor di testo ricco.

CleanShot 2025-06-11 at 15.45.35


Aggiornamento: se preferite che i vostri membri vedano il compositore Markdown per impostazione predefinita:

45 Mi Piace

Ottime notizie. C’è una funzionalità nella roadmap che è già presente in tutti gli editor avanzati? Testo colorato? Poiché markdown non supporta il testo colorato, questo può essere ottenuto utilizzando componenti aggiuntivi CSS. In alternativa, potrebbero esserci altre opzioni di cui non siamo a conoscenza.

3 Mi Piace

C’è un’impostazione per quale editor è predefinito dopo? Grazie.

4 Mi Piace

Non ancora, ma abbiamo in programma di aggiungerne una.

12 Mi Piace

Quando si preme il pulsante “dimensione testo” (che non sembra essere qui su questo sito ma lo è sul mio) si ottiene questo errore

Inoltre, non vedo l’“interfaccia utente dell’immagine” nel post?

Non vedevo l’ora di avere l’opzione di ridimensionamento delle immagini e adoro la semplicità di questa!

8 Mi Piace

è una personalizzazione che dovrebbe essere aggiornata per essere compatibile con il nuovo editor, forse stai usando un componente del tema come Composer Button Bonanza? (ce ne sono probabilmente altri)

hai aggiornato Discourse di recente? in tal caso, devi fare clic sull’immagine nel composer per vederla

3 Mi Piace

Credo che questo sia il plugin bbcode ufficiale, ricordo che avesse un sacco di cose, come il supporto per il colore e la dimensione.

4 Mi Piace

I miei suggerimenti:

  1. Mi piace scrivere con markdown (forse mi ci sono solo abituato?), ma quando uso la versione markdown, non mi piace il nuovo font monospace, quindi per me non ha senso includere l’editor rich nella mia community (dato che probabilmente sarò io quello che scriverà di più). Detto questo, questa potrebbe essere un’impostazione che un utente può abilitare/disabilitare. Ad esempio, se la disabilito, ottengo sempre solo la versione markdown, quindi mantengo il font “normale” (non il monospace). Se la abilito, allora ottengo ciò che è stato implementato. Come amministratore posso abilitarla per la community, ma ogni utente potrebbe abilitarla/disabilitarla. In alternativa, ogni utente potrebbe decidere quale font usare nella versione markdown.
  2. Trovo un po’ distraente che quando l’editor rich è abilitato, l’intero composer viene ridimensionato e spostato. Soprattutto se userò entrambe le versioni in modo intercambiabile (so che lo farò), avere la finestra che si ridimensiona ogni volta che clicco sull’interruttore, mi sembra distraente. Capisco che con l’editor rich non abbiamo bisogno del pannello di anteprima aggiuntivo a destra, ma comunque… forse quello spazio potrebbe essere usato per qualcos’altro?
  3. Questo è solo un piccolo dettaglio, ma se il ridimensionamento rimarrà, sembra strano che il composer sia allineato al centro della pagina, ma rispetto all’area dell’argomento, non è allineato e quindi mi sembra strano ai miei occhi:

Ad essere sincero, non sono ancora convinto che userò questa funzione. Posso vedere come potrebbe eventualmente essere utile, ma al momento ho sempre quella sensazione “pruriginosa” ogni volta che penso di usarla.

4 Mi Piace

Un utente ha provato del codice HTML e non è stato renderizzato in modalità WYSIWYG: tutto ciò che è successo è che il testo HTML è stato inserito in una casella. Quando si torna al markdown, si vede il risultato corretto nel pannello di anteprima. Le èsupposto che mostri i risultati dell’HTML o è necessario tornare al markdown per un’anteprima? ad es.

Wiki articolo in costruzione
Si prega di consentire al creatore di lavorare su questo come è in grado. Siete liberi di offrire aiuto o consigli rispondendo, ma per favore non modificate senza permesso.

`

2 Mi Piace

È intenzionale, il supporto HTML complesso viene eseguito solo tramite il blocco HTML “passthrough”, come hai visto.


<hr>

<H2 style="color:red;">Articolo del Wiki in costruzione</H2>

<p> Si prega di consentire al creatore di lavorare su questo come è in grado. Sei libero di offrire aiuto o consigli rispondendo, ma ti preghiamo di non modificarlo senza permesso.</p>

<hr>

Considerando che lo style viene rimosso dal sanificatore, perché non scrivere semplicemente questo?


---

## Articolo del Wiki in costruzione

Si prega di consentire al creatore di lavorare su questo come è in grado. Sei libero di offrire aiuto o consigli rispondendo, ma ti preghiamo di non modificarlo senza permesso.

---

2 Mi Piace

Ho testato il nuovo composer sul nostro forum e mi piace molto, ma durante il test ho riscontrato un comportamento strano che non so se sia intenzionale o meno.

Quando si cita qualcuno usando il vecchio editor, il layout è corretto e il cursore appare sotto la citazione:

Tuttavia, sia usando quello nuovo per impostazione predefinita, sia cambiandolo durante la composizione di una risposta, il cursore salta automaticamente alla fine del testo citato:

Se si digita qualcosa, questo viene conteggiato nella citazione e, tentando di rispondere, appare l’errore del post:

Se questo è il comportamento predefinito, possiamo informare i nostri utenti, volevo solo essere sicuro se si tratta del nuovo comportamento quando si citano gli utenti con il nuovo editor.

Grazie.

1 Mi Piace

Non è intenzionale, abbiamo un’attività interna per migliorare questo comportamento in particolare.

3 Mi Piace

Ciao :waving_hand: Grazie, questo è davvero fantastico :heart_eyes:

Ho notato che non supportava ancora il wrap [wrap]Hello[/wrap] e ho ricevuto questo messaggio quando ho provato a usarlo.

Token type wrap_open not supported by Markdown parser

2 Mi Piace

Non credo ci sia un piano per supportare un nodo generico “wrap”, come sarebbe? Solo un div?

O c’è un [wrap=qualcosa] che ti aspetti di usare con il nuovo composer?

2 Mi Piace

dove hai visto questo messaggio di errore? La mia istanza elimina semplicemente il BBcode



diventa


Hello

Usiamo alcuni componenti tematici come Discourse Icon e Discourse Stickers.

Penso di poter creare il componente sticker senza wrap perché è solo per il target e aggiungere uno stile allo sticker.

Incollalo sul lato dell’Editor di testo RTF o passa dal lato Markdown se lo hai incollato lì.

2 Mi Piace

non ottengo l’errore, ma il BBcode rimane lì. Non c’è anteprima sul desktop, quando l’editor di testo RTF è selezionato



quello era sul commit hash di Discourse latest-release +269

e

commit hash BBcode 1fbff6b1

Questo funziona come previsto, il BBCode digitato viene intenzionalmente escapato (= mostrato come testo) se non viene riconosciuto/implementato, il che è il caso.

Funzionerebbe per te:

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

3 Mi Piace