BBCode ("Bulletin Board Code") is a lightweight markup language used to format messages in many Internet forum software. It was first introduced in 1998. [1] The available "tags" of BBCode are usually indicated by square brackets ([
and ]
) surrounding a keyword, and are parsed before being translated into HTML.[ citation needed ]
Example in HTML/CSS | BBCode | Output | ||||
---|---|---|---|---|---|---|
<b>bolded text</b> [2] ,<strong>bolded text</strong> or<spanstyle="font-weight: bold;">bolded text</span> | [b]bolded text[/b] | bolded text | ||||
<i>italicized text</i> ,<em>italicized text</em> or<spanstyle="font-style: italic;">italicized text</span> | [i]italicized text[/i] | italicized text | ||||
<ins>underlined text</ins> or<spanstyle="text-decoration: underline;">underlined text</span> | [u]underlined text[/u] | underlined text | ||||
<del>strikethrough text</del> or<spanstyle="text-decoration: line-through;">strikethrough text</span> | [s]strikethrough text[/s] | |||||
<ahref="https://en.wikipedia.org">https://en.wikipedia.org</a> <ahref="https://en.wikipedia.org">English Wikipedia</a> | [url]https://en.wikipedia.org[/url] [url=https://en.wikipedia.org]English Wikipedia[/url] | https://en.wikipedia.org English Wikipedia | ||||
<imgsrc="https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png"alt="This is just an example"/> | [imgalt="Thisisjustanexample"]https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png[/img] | ![]() | ||||
<imgsrc="Smileys/Face-smile.svg"alt=":-)"> | :) or [:-)] This would be another way to use the [img]url_img[/img] and must be pre-configured by the forum administrator.(This and other emoticons, depending on the variant. Most BBCodes do not enclose emoticons in square brackets, leading to frequent accidental usage.) | ![]() (Specific image and size vary.) | ||||
<blockquote><p>quoted text</p></blockquote> (Usually implemented in more advanced ways.) | [quote]quoted text[/quote] [quote="author"]quoted text[/quote] (including optional author ) | Using a Wikipedia template:
| ||||
<pre>monospaced text</pre> | [code]monospaced text[/code] | monospaced text | ||||
<spanstyle="font-size:30px">Large Text</span> or<spanstyle="font-size:85%">Smaller Text</span> | [stylesize="30px"]Large Text[/style] [stylesize="85"]Smaller Text[/style] (The unit of measurement varies with each BBCode variant and could represent pixels, points, or relative HTML sizes.) | Large Text Smaller Text | ||||
<spanstyle="color:fuchsia;">Text in fuchsia</span> or<spanstyle="color:#FF00FF;">Text in fuchsia</span> | [stylecolor="fuchsia"]Text in fuchsia[/style] or[stylecolor=#FF00FF]Text in fuchsia[/style] or[color=#FF00FF]Text in fuchsia[/color] (Both HTML color names and hexadecimal color values are generally supported, although on some boards, you must omit the # from selecting a hexadecimal color.) | Text in fuchsia | ||||
<ul><li>Entry A</li><li>Entry B</li></ul><ol><li>Entry 1</li><li>Entry 2</li></ol> | [list] [*]Entry A [*]Entry B [/list][list=1] [*]Entry 1 [*]Entry 2 [/list] Some message boards do not need the square brackets around the markers. [3] (Many variants for |
| ||||
<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> | [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] (Some variants for |
| ||||
Source: [4] |
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 ]
Applying traditional parsing techniques is made difficult by ambiguities in the markup, such as in [quote=[b]text[/b][/quote]
, where the input can either be interpreted as "text" quoted from someone called [b
, or the bolded text "text" surrounded by [quote=
and [/quote]
, i.e. [quote=text[/quote]
.