Editing BBCode

{{Short description|Lightweight markup language used in message boards}}
{{distinguish|BBC}}
'''BBCode''' ("Bulletin Board Code") is a [[lightweight markup language]] used to format messages in many [[Internet forum]] software. It was first introduced in 1998.<ref>{{cite web |title=BBCode history |url=https://www.bbcode.org/history.php |website=www.bbcode.org |access-date=21 February 2025}}</ref> The available "tags" of BBCode are usually indicated by [[Bracket|square brackets]] (<code>[</code> and <code>]</code>) surrounding a keyword, and are [[parsing|parsed]] before being translated into [[HTML]].{{cn|date=December 2024}}

==Tags==
{| class="wikitable" style="width:100%; text-align:left;"
! style="width:40%;" | Example in HTML/CSS
! style="width:40%;" | BBCode
! style="width:20%;" | Output
|-
| <syntaxhighlight lang="html" inline><b>bolded text</b></syntaxhighlight><ref>{{Cite web|title=HTML Text Formatting|url=https://www.w3schools.com/html/html_formatting.asp|access-date=2021-05-01|website=W3Schools}}</ref>,<br><!--
--><syntaxhighlight lang="html" inline><strong>bolded text</strong></syntaxhighlight> or<br><!--
--><syntaxhighlight lang="html" inline><span style="font-weight: bold;">bolded text</span></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[b]bolded text[/b]</syntaxhighlight>
| '''bolded text'''
|-
| <syntaxhighlight lang="html" inline><i>italicized text</i></syntaxhighlight>,<br><!--
--><syntaxhighlight lang="html" inline><em>italicized text</em></syntaxhighlight> or<br><!--
--><syntaxhighlight lang="html" inline><span style="font-style: italic;">italicized text</span></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[i]italicized text[/i]</syntaxhighlight>
| ''italicized text''
|-
| <syntaxhighlight lang="html" inline><ins>underlined text</ins></syntaxhighlight> or<br><!--
--><syntaxhighlight lang="html" inline><span style="text-decoration: underline;">underlined text</span></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[u]underlined text[/u]</syntaxhighlight>
| <span style="text-decoration:underline;">underlined text</span>
|-
| <syntaxhighlight lang="html" inline><del>strikethrough text</del></syntaxhighlight> or<br><!--
--><syntaxhighlight lang="html" inline><span style="text-decoration: line-through;">strikethrough text</span></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[s]strikethrough text[/s]</syntaxhighlight>
| <s>strikethrough text</s>
|-
| <syntaxhighlight lang="html" inline><a href="https://en.wikipedia.org">https://en.wikipedia.org</a></syntaxhighlight><br><!--
--><syntaxhighlight lang="html" inline><a href="https://en.wikipedia.org">English Wikipedia</a></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[url]https://en.wikipedia.org[/url]</syntaxhighlight><br><!--
--><syntaxhighlight lang="bbcode" inline>[url=https://en.wikipedia.org]English Wikipedia[/url]</syntaxhighlight>
| <span class="plainlinks">[https://en.wikipedia.org https://en.wikipedia.org]</span><br><!--
--><span class="plainlinks">[https://en.wikipedia.org English Wikipedia]</span>
|-
| <syntaxhighlight lang="html" inline=""><img src="https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png" alt="This is just an example" /></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline="">[img alt="This is just an example" ]https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png[/img]</syntaxhighlight>
| [[File:Example.png|172px|link=]]
|-
| <syntaxhighlight lang="html" inline><img src="Smileys/Face-smile.svg" alt=":-)"></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>:)</syntaxhighlight> or <syntaxhighlight lang="bbcode" inline>[:-)]</syntaxhighlight><br><!--
-->This would be another way to use the <syntaxhighlight lang="bbcode" inline>[img]url_img[/img]</syntaxhighlight> and must be pre-configured by the forum administrator.<br><!--
--><small>(This and other [[emoticon]]s, depending on the variant. Most BBCodes do not enclose emoticons in square brackets, leading to frequent accidental usage.)</small>
| [[File:Face-smile.svg|24px|:-)|link=]]<br><!--
--><small>(Specific image and size vary.)</small>
|-
| <syntaxhighlight lang="html" inline><blockquote><p>quoted text</p></blockquote></syntaxhighlight><br><!--
--><small>(Usually implemented in more advanced ways.)</small>
| <syntaxhighlight lang="bbcode" inline>[quote]quoted text[/quote]</syntaxhighlight><br><!--
--><syntaxhighlight lang="bbcode" inline>[quote="author"]quoted text[/quote]</syntaxhighlight><br><!--
--><small>(including optional <code>author</code>)</small>
| Using a Wikipedia template: {{quote|text=quoted text}}{{quote|author=author|text=quoted text}}
|-
| <syntaxhighlight lang="html" inline><pre>monospaced text</pre></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[code]monospaced text[/code]</syntaxhighlight>
| <code>monospaced text</code>
|-
| <syntaxhighlight lang="html" inline><span style="font-size:30px">Large Text</span></syntaxhighlight> or<br><syntaxhighlight lang="html" inline><span style="font-size:85%">Smaller Text</span></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[style size="30px"]Large Text[/style]</syntaxhighlight><br><!--
--><syntaxhighlight lang="bbcode" inline>[style size="85"]Smaller Text[/style]</syntaxhighlight><br><!--
--><small>(The unit of measurement varies with each BBCode variant and could represent pixels, points, or relative HTML sizes.)</small>
| <span style="font-size:30px;">Large Text</span><br><!--
--><span style="font-size:85%;">Smaller Text</span>
|-
| <syntaxhighlight lang="html" inline><span style="color:fuchsia;">Text in fuchsia</span></syntaxhighlight> or<br><!--
--><syntaxhighlight lang="html" inline><span style="color:#FF00FF;">Text in fuchsia</span></syntaxhighlight>
| <syntaxhighlight lang="bbcode" inline>[style color="fuchsia"]Text in fuchsia[/style]</syntaxhighlight> or<br><!--
--><syntaxhighlight lang="bbcode" inline>[style color=#FF00FF]Text in fuchsia[/style]</syntaxhighlight> or<br><!--
--><syntaxhighlight lang="bbcode" inline>[color=#FF00FF]Text in fuchsia[/color]</syntaxhighlight><br><!--
--><small>(Both [[Web_colors#HTML_color_names|HTML color names]] and [[hexadecimal color]] values are generally supported, although on some boards, you must omit the <code>#</code> from selecting a hexadecimal color.)</small>
| <span style="color:fuchsia;">Text in fuchsia</span>
|-
| <syntaxhighlight lang="html">
<ul>
  <li>Entry A</li>
  <li>Entry B</li>
</ul>

<ol>
  <li>Entry 1</li>
  <li>Entry 2</li>
</ol>
</syntaxhighlight>
| <syntaxhighlight lang="bbcode">
[list]
  [*]Entry A
  [*]Entry B
[/list]

[list=1]
  [*]Entry 1
  [*]Entry 2
[/list]
</syntaxhighlight>
Some message boards do not need the square brackets around the markers.<ref>e.g. BOINC Project Forums et al.</ref>

<small>(Many variants for <code>li</code> and <code>/li</code>, list types – unordered and ordered, with different bullets or counter formats – etc.)</small>
|
* Entry A
* Entry B

# Entry 1
# Entry 2
|-
| <syntaxhighlight lang="html">
<table>
<tr>
  <td>table cell 1</td>
  <td>table cell 2</td>
</tr>
<tr>
  <td>table cell 3</td>
  <td>table cell 4</td>
</tr>
</table>
</syntaxhighlight>
| <syntaxhighlight lang="bbcode">
[table]
[tr]
  [td]table cell 1[/td]
  [td]table cell 2[/td]
[/tr]
[tr]
  [td]table cell 3[/td]
  [td]table cell 4[/td]
[/tr]
[/table]
</syntaxhighlight>
<small>(Some variants for <code>thead</code>, rules, etc.)</small>
|
{| class="wikitable"
|-
| | table cell 1
| | table cell 2
|-
| | table cell 3
| | table cell 4
|}
|-
| colspan="3" style="text-align: center;" | '''Source:'''<ref>{{cite web |title=BBCode tags reference |url=https://www.bbcode.org/reference.php |website=www.bbcode.org |access-date=12 January 2022}}</ref>
|}

== Implementation ==
BBCode is typically implemented by applying a series of [[regular expression]] string-replace operations upon the input. Because regular expressions are limited in analyzing the structure of text input, this has the artifact that any non-hierarchical BBCode input will be transformed into invalid non-hierarchical HTML without error.{{Citation needed|date=January 2022}}

Applying traditional parsing techniques is made difficult by [[syntactic ambiguity|ambiguities]] in the markup, such as in {{code|1=[quote=[b]text[/b][/quote]}}, where the input can either be interpreted as "text" quoted from someone called {{code|[b}}, or the bolded text "text" surrounded by {{code|1=[quote=}} and {{code|lang=bbcode|code=[/quote]}}, i.e. <code>[quote='''text'''[/quote]</code>.

==See also==
* [[Markdown]]

==References==
<references />

== External links ==
* [http://www.bbcode.org/ BBCode users guide]
* [https://any2bb.com/ RTF/HTML to BBCode online converter]
[[Category:Lightweight markup languages]]