Formattazione dei post usando markdown, BBCode e HTML

:bookmark: Questa guida di riferimento descrive tutte le opzioni di formattazione disponibili nei post di Discourse, inclusi markdown, BBCode e HTML. Specifica cosa è supportato e fornisce risorse dove è possibile visualizzare esempi.

:person_raising_hand: Livello utente richiesto: Tutti gli utenti

Comprendere la formattazione supportata nei post

Sebbene il testo semplice sia sufficiente per la maggior parte delle risposte, Discourse consente agli utenti di migliorare la formattazione dei propri post utilizzando markdown, BBCode e HTML. Questa guida spiega quali tipi di formattazione sono supportati e come è possibile utilizzarli in modo efficace.

È anche possibile esercitarsi con alcune basi in un tutorial interattivo inviando un messaggio privato a @discobot qui o su qualsiasi sito Discourse.

Sommario

Questa guida copre:

  • Sintassi markdown supportata
  • Tag BBCode supportati
  • Tag e attributi HTML supportati e sicuri

Best practice

  • Utilizzare il markdown principalmente per la sua semplicità e leggibilità.
  • Mescolare markdown e BBCode solo quando necessario e mantenere un uso coerente.
  • Limitare l’uso dell’HTML a tag semplici e sicuri per evitare problemi di formattazione e garantire la sicurezza dei post.

Markdown supportato

Discourse utilizza markdown-it per la sua implementazione markdown.

Alcune funzionalità markdown comunemente utilizzate includono:

  • Grassetto: **testo**

  • Corsivo: *testo*

  • Link: [titolo](https://example.com)

  • Codice inline: `codice`

  • Evidenziazione: <mark></mark>

  • Blocco di codice:

    ```
    blocco di codice
    ```
    

Nei post più lunghi (come questo), può essere utile aggiungere struttura utilizzando le intestazioni:

# Intestazione 1
## Intestazione 2
### Intestazione 3

Nota: quando viene caricata un’immagine, la sintassi markdown per fare riferimento all’immagine verrà generata automaticamente.

![didascalia|500x500](upload://image.jpeg)

Per un elenco completo delle funzionalità markdown, consultare la guida interattiva.

BBCode supportato

Discourse supporta un sottoinsieme di tag BBCode comuni, alcuni dei quali vengono generati automaticamente per supportare la formattazione speciale, ad esempio quando si cita un post nella propria risposta:

[quote=“utente”]testo citato[/quote]

[quote="user"]quoted text[/quote]

È anche possibile utilizzare BBCode per contrassegnare il testo nascosto come spoiler o come dettagli

testo spoilerato

[spoiler]spoiled text[/spoiler]

[details=“clicca per espandere”]testo nascosto[/details]

[details="click to expand"]hidden text[/details]

Sono supportati anche i tag BBCode per la formattazione semplice supportata da markdown o:

  • [b]forte[/b]
  • [i]enfasi[/i]
  • [u]sottolineato[/u]
  • [s]barrato[/s]
  • [ul][li]opzione uno[/li][/ul]
  • [img]http://example.com/image.png[/img]
  • [url]http://example.com[/url]
  • [code]codice[/code]

Per un elenco completo dei tag BBCode supportati e degli esempi, consultare i test BBCode di Discourse.

HTML supportato

Discourse supporta un sottoinsieme sicuro di HTML. Sebbene sia possibile mescolare HTML con markdown, sono consentiti solo tag e attributi HTML specifici per garantire sicurezza e coerenza dello stile.

Alcuni dei tag HTML consentiti includono:

  • <a href="https://example.com">link</a>
  • <strong>testo in grassetto</strong>
  • <em>testo in corsivo</em>
  • <ul><li>elemento elenco</li></ul>
  • <img src="https://example.com/image.png" alt="descrizione">

Per un elenco dettagliato dei tag e degli attributi HTML consentiti, consultare la lista consentita di Discourse.

:information_source: Nota: Gli stili inline, come <span>testo colorato</span>, non sono supportati. Per stili personalizzati, vedere personalizzare i contenuti dei post.

Problemi comuni e soluzioni

  • I tag BBCode o HTML non funzionano: Assicurarsi che i tag utilizzati facciano parte del sottoinsieme supportato.
  • Gli stili inline vengono rimossi: Discourse non supporta gli stili inline per motivi di sicurezza. Utilizzare stili personalizzati o plugin se necessario.
  • La formattazione cambia incollando da altri editor: Alcuni formati di testo ricco potrebbero non essere visualizzati correttamente. Utilizzare il markdown per formattare il testo in modo coerente.

FAQ

D: Posso usare le tabelle in Discourse?
R: Sì, è possibile utilizzare il markdown per creare tabelle. Per maggiori informazioni, consultare questa guida sulle tabelle.

D: Perché il mio stile inline non funziona?
R: Discourse non supporta gli stili inline in HTML per motivi di sicurezza. Prendere in considerazione l’utilizzo di BBCode personalizzato o della guida di stile personalizzato di Discourse.

D: Posso aggiungere tag BBCode personalizzati?
R: Sì, è possibile aggiungere tag BBCode personalizzati. Consultare il plugin BBCode di Discourse per maggiori informazioni.

Risorse aggiuntive

31 Mi Piace

Nessuno di questi riferimenti menziona tabelle.

2 Mi Piace

È vero, ma quest’altro argomento lo è. Adding a table to your post using markdown

3 Mi Piace

Il colore del testo e il colore di sfondo del testo non sembrano funzionare con <span> o bbcode, mi sfugge qualcosa?

  • <span>testo markdown rosso</span>
    • testo markdown rosso
  • bbcode: [color=red]Testo a colori rossi[/color]
    • [color=red]Testo a colori rossi[/color]
2 Mi Piace

Sì, sembra che lo stile inline HTML non sia supportato

Puoi utilizzare questa guida:

(E vederla in azione qui: 📜 [Wiki] Schlumpf hub serial numbers reference - Unicycles and Equipment - Unicyclist.com)

Oppure utilizzare questo plugin che estende il supporto BBcode:

Per quanto riguarda i tag HTML consentiti, credo che questo sia il riferimento:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/pretty-text/addon/allow-lister.js#L115

Anche se non trovo tag HTML di tabella (che sono consentiti) all’interno per qualche motivo.

Forse perché sono referenziati qui:

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/pretty-text/engines/discourse-markdown/table.js#L31

5 Mi Piace

Grazie mille per i riferimenti utili!

1 Mi Piace

Sembra che attualmente il filtro sia impostato in modo che gli attributi rowspan e colspan sugli elementi td e th vengano filtrati. La mia comprensione è che questi siano sicuri (e credo che siano molto utili): il team sarebbe disposto a consentire questi attributi?

Come nota a margine, @Canapin ha parlato della posizione dell’elenco consentito di tag table.

Il file .../discourse-markdown/table.js, tuttavia, sembra essere un’implementazione specifica per le tabelle Markdown; le tabelle HTML normali avrebbero bisogno di un’estensione separata per allowList?

Credo che rowspan e colspan siano abbastanza sicuri, ma vorrei anche chiedere un altro pezzo di markup. Potremmo consentire gli attributi data-* sugli elementi della tabella? Penso che sarebbe molto utile per specificare diversi tipi di contenuti della tabella, in particolare da utilizzare come hook per CSS personalizzati.

1 Mi Piace

Ciao :slight_smile:

Penso che sarebbe più complicato del previsto.
Se crei una tabella HTML nel tuo post e qualcuno cita la tua tabella, questa viene convertita in Markdown, che non supporta rowspan e colspan.

Sospetto che ci sarebbero altri problemi a cui non ho pensato.

Non è esattamente la stessa cosa, ma puoi racchiudere la tua tabella con i tag [wrap] :slight_smile:
Vedi: Customize posts' contents with your own styles
Ma non sarai in grado di avere attributi data- all’interno di una tabella HTML (ad esempio, per personalizzare righe o celle specifiche).

modifica: se la tua tabella utilizza Markdown anziché HTML, puoi inserire span con attributi data- in questo modo:

|Colonna 1 | Colonna 2|
|--- | ---|
|<span data-thing>test</span> | test|
|test | test|

Ma verranno rimossi se qualcuno cita o copia incolla la tua tabella.

1 Mi Piace

Sarebbe molto utile se alcuni stili CSS inline semplici e sicuri venissero rispettati nell’HTML non elaborato aggiunto ai post di Discourse. Ci potrebbero essere post HTML convertiti da un precedente motore di forum e/o gli utenti a volte incollano testo formattato con cose come l’allineamento del testo e/o delle immagini.

Quanto segue funziona come previsto:


<div>
<p>Test</p>
</div>

Test

Ma questo non funziona:


<p style="text-align: center;">Test</p>

Test


Lo stesso vale per la formattazione inline <span> style="color: ....

È più probabile che ci siano stili inline come questi in contenuti convertiti / incollati da altri editor WYSIWYG.

L’attributo style non è consentito in Discourse perché potrebbe facilmente causare problemi.

Inoltre, Discourse ha una certa filosofia su come le informazioni debbano essere presentate nei post e limita tag e attributi di proposito.

L’attributo align su <div è esplicitamente consentito qui: https://github.com/discourse/discourse/blob/main/app/assets/javascripts/pretty-text/addon/allow-lister.js#LL147C2-L147C16

Se dovessi migrare un forum e volessi mantenere uno stile speciale come i colori, opterei per Discourse BBCode e modificherei l’importer se necessario :slight_smile:

3 Mi Piace

C’è un motivo per cui il markup del blocco citazione > non è incluso nella sezione Markdown? Questa è di gran lunga, secondo la mia esperienza, la cosa più comune che le persone non usano quando dovrebbero.

So che non puoi elencare tutto, ma nei forum in cui le persone citano spesso altre fonti, questo è essenziale.

@one1, dovrebbe essere scoraggiato per la citazione intra-forum. Il suo sostituto è [quote]. Altrimenti, sono d’accordo.

Stavo parlando di citare da articoli accademici.

Questo è super utile! Grazie mille! :grinning_face:

Quel link non funziona.

2 Mi Piace

Grazie! Ora dovrebbe essere risolto.

1 Mi Piace

8 messaggi sono stati spostati in un nuovo argomento: Uso dei titoli H1 rispetto a H2 nel compositore

(post eliminato dall’autore)