Formattare i post usando Markdown, BBCode e HTML

:bookmark: This reference guide details all the formatting options available in Discourse posts, including markdown, BBCode, and HTML. It specifies what is supported and provides resources where you can see examples.

:person_raising_hand: Required user level: All users

Understanding supported formatting in posts

While plain text is sufficient for most replies, Discourse allows users to enhance the formatting of their posts by using markdown, BBCode, and HTML. This guide explains what types of formatting are supported and how you can use them effectively.

You can also practice some of the basics in an interactive tutorial by sending a personal message to @discobot here or on any Discourse site.

Summary

This guide covers:

  • Supported markdown syntax
  • Supported BBCode tags
  • Supported and safe HTML tags and attributes

Best practices

  • Use markdown primarily for its simplicity and readability.
  • Mix markdown and BBCode only when necessary, and keep usage consistent.
  • Limit the use of HTML to simple, safe tags to avoid formatting issues and ensure posts are secure.

Supported markdown

Discourse uses markdown-it for its markdown implementation.

Some commonly used markdown features include:

  • Bold: **text**
  • Italic: *text*
  • Link: [title](https://example.com)
  • Inline code: `code`
  • Highlight: <mark></mark>
  • Code block:
    ```
    code block
    ```
    

In longer posts (like this one), it can also be helpful to add structure using headings:

# Heading 1
## Heading 2
### Heading 3

Note: when an image is uploaded, the markdown syntax to reference the image will automatically be generated.

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

For a full list of markdown features, please refer to the interactive guide.

Supported BBCode

Discourse supports a subset of common BBCode tags, some of which are generated automatically to support special formatting, for example when you quote a post in your reply:

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

You can also use BBCode to mark hide text as a spoiler or as details

spoiled text

[spoiler]spoiled text[/spoiler]
click to expand

hidden text

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

BBCode tags for simple formatting supported by markdown or are also supported:

  • [b]strong[/b]
  • [i]emphasis[/i]
  • [u]underlined[/u]
  • [s]strikethrough[/s]
  • [ul][li]option one[/li][/ul]
  • [img]http://example.com/image.png[/img]
  • [url]http://example.com[/url]
  • [code]code[/code]

For a complete list of supported BBCode tags and examples, check the Discourse BBCode tests.

Supported HTML

Discourse supports a safe subset of HTML. While you can mix HTML with markdown, only specific HTML tags and attributes are allowed to ensure security and consistent styling.

Some of the allowed HTML tags include:

  • <a href="https://example.com">link</a>
  • <strong>bold text</strong>
  • <em>italic text</em>
  • <ul><li>list item</li></ul>
  • <img src="https://example.com/image.png" alt="description">

For a detailed list of allowed HTML tags and attributes, refer to Discourse’s allow-list.

:information_source: Note: Inline styles, like <span style="color:red">colored text</span>, are not supported. For custom styles, see customize post contents.

Common issues and solutions

  • BBCode or HTML tags not working: Ensure the tags you are using are part of the supported subset.
  • Inline styles being stripped: Discourse does not support inline styles for security reasons. Use custom styles or plugins if necessary.
  • Formatting changes on pasting from other editors: Some rich-text formats may not render correctly. Use markdown to format text consistently.

FAQs

Q: Can I use tables in Discourse?
A: Yes, you can use markdown to create tables. For more information, see this guide on tables.

Q: Why isn’t my inline style working?
A: Discourse does not support inline styles in HTML for security reasons. Consider using custom BBCode or the Discourse custom styling guide.

Q: Can I add custom BBCode tags?
A: Yes, you can add custom BBCode tags. Refer to the Discourse BBCode plugin for more information.

Additional resources

Last edited by @MarkDoerr 2024-07-11T00:31:08Z

Check documentPerform check on document:
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

2 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]
1 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: