使用 Markdown、BBCode 和 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 个赞

这些参考资料均未提及表格。

2 个赞

但是这个话题是真的。 Adding a table to your post using markdown

2 个赞

文本颜色和文本背景颜色似乎无法与 <span> 或 bbcode 一起使用,我是否遗漏了什么?

  • <span><span>一些红色的 markdown 文本</span>
    • 一些红色的 markdown 文本
  • bbcode:[color=red]红色文本[/color]
    • [color=red]红色文本[/color]
1 个赞

是的,看起来不支持 HTML 内联样式。

您可以使用此指南:

(并在此处查看实际效果:https://unicyclist.com/t/wiki-schlumpf-hub-serial-numbers-reference/106130)

或者使用这个扩展了 BBcode 支持的插件:

至于允许的 HTML 标签,我相信这是参考:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/pretty-text/addon/allow-lister.js#L115

尽管我在这里找不到表格 HTML 标签(它们是允许的)。

也许是因为它们在此处被引用:

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

5 个赞

非常感谢您提供的有用参考资料!

1 个赞

看起来目前过滤器设置如下:tdth 元素上的 rowspancolspan 属性被过滤掉了。我的理解是这些是安全的(而且我认为它们非常有用):团队是否愿意允许这些属性?

顺便说一下,@Canapin 谈到了允许列表 table 标签的位置。

但是,.../discourse-markdown/table.js 文件似乎是专门围绕 Markdown 表格实现的;常规 HTML 表格是否需要一个单独的 allowList 扩展?

我相信 rowspancolspan 是相当安全的,但我也想请求另一种标记。我们能否允许 table 元素上的 data-* 属性?我认为这对于指定不同类型的表格内容非常有用,特别是可以作为自定义 CSS 的钩子。

1 个赞

你好 :slight_smile:

我认为这会比预期的要棘手。
如果你在帖子中创建了一个 HTML 表格,有人引用了你的表格,它会被转换为 Markdown,而 Markdown 不支持 rowspancolspan

我怀疑还会出现其他我没想到的问题。

这不完全一样,但你可以用 [wrap] 标签包裹你的表格 :slight_smile:
参见:Customize posts' contents with your own styles
但你无法在 HTML 表格 内部 使用 data- 属性(例如,用于自定义特定行或单元格)。

编辑:如果你的表格使用的是 Markdown 而不是 HTML,你可以像这样插入带有 data- 属性的 span:

|列 1 | 列 2|
|---|---|
|<span data-thing>测试</span> | 测试|
|测试 | 测试|

但如果有人引用或复制粘贴你的表格,它们将被删除。

1 个赞

如果 Discourse 帖子中添加的原始 HTML 能遵循一些简单且安全的内联 CSS 样式,那将非常有帮助。这可能是从之前的论坛引擎转换过来的 HTML 帖子,以及/或用户有时会粘贴富文本,其中包含文本和/或图像对齐等内容。

以下内容按预期工作:



<div align="center">
<p>Test</p>
</div>

Test

但这不起作用:


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

Test


内联 <span style="color: ... 格式也存在同样的问题。

从其他所见即所得编辑器转换/粘贴的内容中,更有可能包含类似的内联样式。

style 属性在 Discourse 中是不允许的,因为它很容易破坏内容。

此外,Discourse 在信息如何在帖子中呈现方面有特定的理念,并故意限制标签和属性。

<div> 上的 align 属性在此处明确允许:https://github.com/discourse/discourse/blob/main/app/assets/javascripts/pretty-text/addon/allow-lister.js#LL147C2-L147C16

如果您要迁移论坛并希望保留一些特殊的样式(如颜色),我建议使用 Discourse BBCode :slight_smile:

3 个赞

Markdown 部分为什么不包含 > 块引用标记?据我经验,这是人们最常应该使用但却未使用的一种标记。

我知道您不可能列出所有内容,但在人们经常引用其他来源的论坛中,这一点至关重要。

@one1,论坛内部引用应被禁止。其替代方案是使用 [quote]。除此之外,我同意。

我是在谈论引用学术论文。

这太有帮助了!非常感谢!:grinning_face: