KEMU Documents server
JavaScript failed !
So this is static version of this website.
This website works a lot better in JavaScript enabled browser.
Please enable JavaScript.

Introduction to BB Code 2.0 (aka KBB)

The BB-Code is a nice markup language.
It's easy to learn and understand. Also it's easy to implement and to extend in any programming language.

We've been using BB-Code for ages. We used it for internal (content management, translations, etc.) and external (comments posts, forums, blogs, etc.) rich-text in all our web services.
We improved the original BB-Code to be more user friendly and to allow us for more magic - and so we created BB Code 2.0.

Why ?

We wanted BB-code to be easier to use by typical user. To be less machine-like, less XML-ish, less HTML-ish, yet still easy to parse.

We use BB-Code in a lot more extensive manner comparing to what is allowed by original BB-Code design. We use it:
  • for embedding advanced visual components in text - for example:
    • tip/help popups embedded into text
    • expand-on-click feature on blocks of text (show/hide details by click)
    • clickable mini-images in text - when clicked, the full-size image is displayed
    • embedding whole dynamic image galleries as piece of text
  • for internal links smart generation.
    For example we use just tag [calc id=ElectricCost] to auto-generate full http anchor to Cost of electricity on calculla website, which internally is translated to proper label (resolving id to language dependency) and proper link (selecting proper domain, http-vs-https prefix and user-friendly resource name)
  • for generating navigation menu from the text content (like the one used by this document)
  • for any other automated view elements embeded text
  • ... and a lot more - which will be covered later in that document
Initially our implementation of BB-Code evolved to internal standard. Of course, mega-lo-maniacally we call it Kemu-BB-Code or shortly KBB :)

Simple code, smart parsing

Forget about strict open-then-close logic. Typical user hates to follow that machine-like rule. BB-Code is not XML, so why bother ?

Examples of smart parsing:
  • closing tag auto-detection example:
    instead of
    [theVerySpecialTag]the text[/theVerySpecialTag]
    we can write
    [theVerySpecialTag]the text[/]
  • closing tag detection more advanced example:
    instead of this (easy to make a mistake)
    [b][i][u]the text[/u][/i][/b]
    we can write this
    [b][i][u]the text[/][/][/]
    and the smart parsing will find out automagically all the closing tags in proper order.
  • auto html open-close:
    it is now pretty legal to write [b]bold[u]bold+underline[/b]underline[/] - the html is generated in completelly proper order (following HTML/XML rules)
  • easy lists handling:
    no more open-close nightmare, instead of this:
    [ul][li]point 1[/li][li]point 2[/li][/ul]
    now just write this:
    [li]point 1[li]point 2[/]
    and you have a nice looking list. Of course html is generated in proper XML-like manner, and lists-inside-lists are still possible (covered later).
  • disable a part of BB-Code:
    If you just want some part of you BB-Code disabled, invisible, hidden.
    For example:
    • you're going to finish a paragraph tommorow, you want to leave it in BBCode, but prevent it from rendering to html
    • you want to make invisible comment visible only for the author(s) of the text - this works like comments in typical source code
    You put [0] at start and [1] of text. Like this:
    this will be [0]in[1]visible part of a word.[0] And that sentence is invisible.[1]
    will be rendered as:
    this will be visible part of a word.
    So simply [0] means OFF and [1] means ON