General Notes | Simple Formatting | Links and Images | Lists | Smilies

This documentation pertains to the DP_ParseBBML CFML Custom Tag.

DP_ParseBBML translates a customized dialect of Bulletin Board Markup Language ("BBML", originally created for use in the popular Ultimate Bulletin Board™) in to browser-ready HTML markup. BBML is easy to learn and use and gives end users safe access to many of HTML's formatting controls.

General Notes back to top

BBML uses "tags" to define what formatting to apply to the text. Tags are special codes surrounded by square brackets ("[]"). "Tag pairs" are used to define what formatting gets applied to what text. In most cases there will be a "start tag" followed by the text to be formatting followed by the "end tag". End tags are the same codes as the start tags prefixed by a forward slash ("/"). Here's a sample of the format:

[Tag]Text to be formatted[/tag]

The following general rules apply to all conversions:

• Only valid BBML code (as defined below) will be converted to HTML.
• Single Line Feed/Carriage Returns will be replaced with the HTML "break" tag (<br>).
• Double Line Feed/Carriage Returns will be replaced with the HTML "paragraph" tags (<p></p>).

Tag Nesting

BBML (like HTML) must be "nested" properly. This is best explained with an example. The first line is not valid BBML and will not be converted while the second line (with properly nested tags) is properly formatted:

Bad: [b]This is [i]some[/b] very fine[/i] sample text.

Good: [b]This is [i]some[/i][/b] [i]very fine[/i] sample text.

BBML tags can be nested in this fashion as deeply as you like. Also BBML tags not case sensitive. In other words [B][/B] and [b][/b] are treated identically.

Many BBML tags have both long, easy to remember versions and shorter, easier to type versions. You cannot mix alternate begin and end tags however. For example "[b]bold text[/bold]" is illegal; either "[b]bold text[/b]" or "[bold]bold text[/bold]" must be used.

Simple Formatting back to top

The basic formatting tags are what you'll be using most often. They general change the way that text is displayed on screen (bold, italic, etc) or add special formatting rules (indents, monospaced fonts, etc).

Simple Formatting

The following simple formatting tags are available.

Style	This BBML Code	Converts to
Bold	[b][/b] or [bold][/bold]	<b>bold</b>
Italic	[i][/i] or [italic][/italic]	<i>italic</i>
Underlined	[u][/u] or [underline][/underline]	<u>underlined</u>
Strikethough	[s][/s] or [strikethrough][/strikethrough]	<s>strikethrough</s>
Superscript	[sup][/sup] or [superscript][/superscript]	<sup>superscript</sup>
Subscript	[sub][/sub] or [subscript][/subscript]	<sub>subscript</sub>

Color and Size

Text color and size can be changed with the following tags:

Style	This BBML Code
Color	[color=color][/color] This tag will set the color of any text within it. Color can be any named color (red, blue, yellow, etc) or a hexidecimal rgb value (for example "#ccffcc").
Size	[size=size][/size] This tag will set the size (font point size) of any text within it. Size must be a number between 8 and 25.

Special Formatting

There are also four special types of simple formatting available:

Style	This BBML Code
Quotation	[q][/q] or [quote][/quote] This tag offsets and indents any text within it as per the HTML <blockquote></blockquote> tag.
Code	[code][/code] Used around blocks of programming code (such as HTML, CFML, JavaScript, etc).
SQL	[sql][/sql] Used around blocks of SQL code, this tag will bold all words reserved in the SQL92 and SQL99 standards such as "SELECT" and "DROP".
Preformated	[pre][/pre] or [preformatted][/preformatted] Text placed within this tag will be displayed in a monospaced font and all spaces will be honored as per the HTML <pre></pre> tag.

Examples

All simple formatting tags can be used within links, lists, and each other (as long as proper nesting rules are honored). This means that you can have very complex nestings and combinations of formatting. Here are some examples of simple formatting:

BBML Code	Result
This is [b]bold[/b] and this is [i]italic[/i].	This is bold and this is italic.
This [b]is a [i][sub]little[/sub] [u]more[/u][/i] complicated[/b]	This is a little more complicated
This [i][s]is[/s] [u]even more complicated[/u][/i], [sup]but still perfectly [b]legal[/b][/sup].	This is even more complicated, but still perfectly legal.
This [color=blue]blue[/color] and this is [color=#FF0000]Red[/color].	This blue and this is Red.
[size=15]This text[/size] is larger than [size=8]this text[/size] but not as large as [size=25]this text[/size].	This text is larger than this text but not as large as this text.

Links and Images back to top

There are two kinds of links available in BBML: "normal" links and email links. A normal link is most often used to reference a web page or FTP site but any valid URL (a web address such as "http://www.depressedpress.com") can be used. An email link is specifically and only used for email address.

Links

Their are two ways create a normal link, simple and complex:

Simple: [link]URL[/link] (or [url]URL[/url])

Complex: [link=URL]Link Label[/link] (or [url=URL]Link Label[/url])

In the same way there are two ways create an email link:

Simple: [email]address[/email]

Complex: [email=address]Label[/email]

In both cases the text between the tags is the visible, clickable part of the link.

Images

Adding images is done with the [img][/img] (or, alternately, with the equivalent [image][/image] tag). You must wrap the full address of the image (for example "http://www.mysite.com/image.jpg") in the tag like so:

[img]image[/img]

Wrapping and Examples

The image tag can be wrapped in the [link] and [email] tags to make clickable images. However the [img] can not have any tags within it. In addition the [link] and [email] tags cannot wrap each other (although they may wrap basic formatting tags).

Here are some examples of links and images:

BBML Code	Result
[link]http://www.yahoo.com[/link]	http://www.yahoo.com
[url=http://www.yahoo.com]Yahoo![/url]	Yahoo!
[b][url=http://www.yahoo.com]Yahoo![/url][/b]	Yahoo!
[email]bill.gates@microsoft.com[/email]	bill.gates@microsoft.com
[email=ppan@neverland.com]Peter Pan[/email]	Peter Pan
[img]http://www.depressedpress.com/Assets/Art/TopArrow.gif[/img]
[link=http://www.depressedpress.com][img]http://www.depressedpress.com/Assets/Art/TopArrow.gif[/img][/link]

Lists back to top

BBML lists come in two basic forms: unordered (or bulleted) lists and ordered (numbered or alphabetized) lists. In both cases the same basic formatting applies. The list tags contain any number of "item" tags ("[*]"). An item tag is placed before each item in the list and does not require and end tag. Here are the types of lists followed by the HTML that they produce:

List Type	BBML Code	Result
Unordered List	[list] [*]Item One [*]Item Two [*]Item Three [/list]	Item One Item Two Item Three
Numbered List	[list=1] [*]Item One [*]Item Two [*]Item Three [/list]	Item One Item Two Item Three
Numbered List (Small Roman Numerals)	[list=i] [*]Item One [*]Item Two [*]Item Three [/list]	Item One Item Two Item Three
Numbered List (Large Roman Numerals)	[list=I] [*]Item One [*]Item Two [*]Item Three [/list]	Item One Item Two Item Three
Alphabetized List (Lowercase)	[list=a] [*]Item One [*]Item Two [*]Item Three [/list]	Item One Item Two Item Three
Alphabetized List (Uppercase)	[list=A] [*]Item One [*]Item Two [*]Item Three [/list]	Item One Item Two Item Three

A list must have at least one item tag ("[*]") in it to be valid. In addition the there can be no text between the beginning list tag and the first item tag ("[list][*][/list]" is correct while "[list]MyList [*][/list]" will fail).

Lists can be nested together as deeply as you like, but each nested list must be a list item of the outer list. Here's an example of nesting:

List	BBML Code	Result
Unordered List	[list] [*]Item One   [list=1]   [*]Item One   [*]Item Two   [list=I]   [*]Item One    [*]Item Two    [*]Item Three     [list=i]     [*]Item One     [*]Item Two     [*]Item Three     [/list]    [/list]   [*]Item Three   [/list] [*]Item Two [*]Item Three [/list]	Item One Item One Item Two Item One Item Two Item Three Item One Item Two Item Three Item Three Item Two Item Three

List items may use any formatting or link tags that you wish and may include images. Lists themselves however may only be contained in other list tags.

Smilies back to top

Smilies, also know as "emoticons" are expressive codes appended to text. They are generally seen as small picture turned 90 degrees to the right so that ":^)" is a "smiling face". There are many different kinds of smilies and some can become very, very elaborate. DP_ParseBBML can convert a subset of these smilies codes into graphical images. Most of the smilies have at least one alternative way to type it and some have several. For our purposes all smilies are made up of three characters however (generally "eyes", "nose" and "mouth").

Here is a list of the smilies supported by DP_ParseBBML and the graphic that will replace it:

Meaning	What to Type	Default Set	Blue Frog* Set
Happy	:^) or :')
Very Happy (Laughing)	:^D or :'D
Apathetic or Neutral	:^| or :'|
Sad	:^( or :'(
Very Sad (Crying)	L^( or L'(
Mad	>^( or >'(
Very Mad	>^X or >'X or >^x or >'x
Wink	;^) or ;')
Wincing	;^| or ;'|
Shouting	:^O or :'O
Interested	=^) or =')
Thinking Hard	;^` or ;'`
Confused	;^d or ;'d
Slightly Shocked	=^~ or ='~
Shocked or Suprised	=^o or ='o or =^O or ='O or =^0 or ='0
Kiss (Puckering Up)	=^* or ='*
Cool	8^) or 8')
Drooling	:^} or :'}
Sticking out tounge	:^b or :'b or :^p or :'p
Yawning	{^o or {'o or {^O or {'O or {^0 or {'0
Sleeping	{^) or {')
Embarassed	#^) or #')
Crazy (Drunk, Blotto)	%^) or %')
Evil	B^> or B'>
Angelic	O^) or O') or o^) or o') or 0^) or 0')
Question Mark	?^) or ?')
Exclmation Point	!^) or !')
Idea (Light Bulb)	$^) or $')

*Provided by Andy Jarrett of The Blue Frog Company.