BBCode is a way to format text. Plain and simple, that is all it does. Some of the formatting is static, like bold and italic. Others are dynamic like the moving text. Others take it into an interactive type of thing, like creating links or adding images. If you know HTML coding, BBCode is almost exactly the same, using the same tags and syntax. The only difference is BBCode uses brackets [] instead of < and >.
There are a couple ways to use the BBCode editor. You can type your entire response and then go thru and each set of text that you want to change, select it, then click the button. Or you can click the button and insert the code and then type the text in between the opening and closing tag. Each tag is enclosed in brackets ([]). The difference between the opening tag and closing tag is that the closing tag uses a forward slash in the brackets. The opening looks like this, [] and the closing looks like this [/] with the tag label in side the brackets and after the forward slash. There is one exception to this rule and that is the horizontal line. There is only one tag for that. Some of the tags have modifiers, like color direction or font. The table below, along with the larger examples below the table, show these. A basic format of BBCode is opening tag, content and then closing tag. What can cause a bit of a headache is that the content can also contain more opening and closing tags. For all intents and purposes, these sets of tags MUST be nested. There are occasions that they may be out of order, but they can have unforeseen consequences so keep your tags nested properly. For instance we will use 1 2 and 3 for labels. This is how they should be. [1][2][3]Test[/3][/2][/1]. See how the inside opening tag is closed first, then the next and then the next?
There are a few peculiarities with the BBCode here. The glow tag and the shadow tag seem to be inoperative on our forum. The glow tag seems to work as a highlighter, and the shadow tag does nothing. Also some of the closing tags will also close other opening tags. One other problem concerns color. On some forums the color part of any tag that uses color, is enclosed in quotes. For example "red". On this forum no quotes are used. If you really want to be creative, you can also use the HTML Hexadecimal color codes instead of just a color name.
Now on to the BBCodes available here.
Now for the examples of the Table, Line and Cell tags. If you look above you can see what it looks like. Below you will see the actual code. There is one difference though, I have changed the URL of the images. Also I have had to change the normal brackets [] with the curly brackets {} so that you can see what the code looks like. Trying to nest code tags is one thing that will teach you the meaning of the word futile. It will mess with your post, so don't try it unless you like pulling out clumps of your hair.
{table}
{tr}
{td}Button{/td}
{td}What it does{/td}
{td}Example{/td}
{td}what the code looks like{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/bold.gif{/img}{/td}
{td} changes your text to bold text.{/td}
{td}{b}Test{/b}{/td}
{td}{code}{b}Test{/b}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/italicize.gif{/img}{/td}
{td} changes the text to italic text.{/td}
{td}{i}Test{/i}{/td}
{td}{code}{i}Test{/i}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/underline.gif{/img}{/td}
{td} underlines your text.{/td}
{td}{u}Test{/u}{/td}
{td}{code}{u}Test{/u}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/strike.gif{/img}{/td}
{td} strikes though your text.{/td}
{td}{s}Test{/s}{/td}
{td}{code}{s}Test{/s}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/glow.gif{/img}{/td}
{td} gives your text a glow.{/td}
{td}{glow=red,2,300}Test{/glow}{/td}
{td}{code}{glow=red,2,300}Test{/glow}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/shadow.gif{/img}{/td}
{td} gives your text a shadow.{/td}
{td}{shadow=red,left}Test{/shadow}{/td}
{td}{code}{shadow=red,left}Test}{/shadow}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/move.gif{/img}{/td}
{td} causes your text to scroll.{/td}
{td}{move}Test{/move}{/td}
{td}{code}{move}Test{/move}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/pre.gif{/img}{/td}
{td} allows you to preformat your text{/td}
{td}{pre}Test
Test
Test
Test
Test
Test{/pre}{/td}
{td}{code}{pre}Test
Test
Test
Test
Test
Test{/pre}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/left.gif{/img}{/td}
{td} moves the beginning of each line to the left.{/td}
{td}{left}Test{/left}{/td}
{td}{code}{left}Test{/left}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/center.gif{/img}{/td}
{td} starts each line in the middle of the page and go each way keeping it centered.{/td}
{td}{center}Test{/center}{/td}
{td}{code}{center}Test{/center}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/right.gif{/img}{/td}
{td} moves the end of each line to the right.{/td}
{td}{right}Test{/right}{/td}
{td}{code}{right}Test{/right}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/hr.gif{/img}{/td}
{td} gives you a horizontal line.{/td}
{td}{hr}{/td}
{td}{code}{hr}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/size.gif{/img}{/td}
{td} allow you to change the size of your text.{/td}
{td}{size=12pt}Test{/size}{/td}
{td}{code}{size=12pt}Test{/size}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/face.gif{/img}{/td}
{td}Selecting text and then clicking this allows you to change your font.{/td}
{td}{font=Blackadder ITC}Test{/font}{/td}
{td}{code}{font=serif}Test{/font}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/flash.gif{/img}{/td}
{td}Allows you to play a flash file{/td}
{td}no example{/td}
{td}{code}{flash=200,200}http://Test.swf{/flash}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/img.gif{/img}{/td}
{td} Allows you to post an image.{/td}
{td}{img}http://images.test.test/img.gif{/img}{/td}
{td}{code}{img}http://location/img.gif{/img}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/url.gif{/img}{/td}
{td} Allows you to give a URL to text. {/td}
{td}{url=http://spywarehammer.com/simplemachinesforum/index.php}Test{/url}{/td}
{td}{code}{url=http://spywarehammer.com/simplemachinesforum/index.php}Test{/url}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/email.gif{/img}{/td}
{td}Allows you to start an e-mail client.{/td}
{td}{email}Test@test.com{/email}{/td}
{td}{code}{email}Test@test.test{/email}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/ftp.gif{/img}{/td}
{td}Allows you to post an FTP link.{/td}
{td}{ftp=ftp://test.test}ftp://test.test{/ftp}{/td}
{td}{code}{ftp}ftp://test.test{/ftp}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/table.gif{/img}{/td}
{td}Allows you to define a table such as the one you are reading. {/td}
{td}See below{/td}
{td}{code}{table}{/table}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/tr.gif{/img}{/td}
{td}Allows you to define a line in the table.{/td}
{td}See below{/td}
{td}{code}{tr}{/tr}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/td.gif{/img}{/td}
{td}Allows you to define a cell in the row in the table{/td}
{td}See below{/td}
{td}{code}{td}{/td}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/sup.gif{/img}{/td}
{td}Creates super script{/td}
{td}Test{sup}Test{/sup}{/td}
{td}{code}Test{sup}Test{/sup}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/sub.gif{/img}{/td}
{td}Creates Subscript{/td}
{td}Test{sub}Test{/sub}{/td}
{td}{code}Test{sub}Test{/sub}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/tele.gif{/img}{/td}
{td}This will give you a teletype font (all characters the same width){/td}
{td}{tt}Test{/tt}{/td}
{td}{code}{tt}Test{/tt}{/code}{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/code.gif{/img}{/td}
{td}Allows you to post code so you can see all the characters.{/td}
{td}See below{/td}
{td}See below{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/quote.gif{/img}{/td}
{td}Allows you to quote a person or post{/td}
{td}See below{/td}
{td}See Below{/td}
{/tr}
{tr}
{td}{img}http://images.test.test/list.gif{/img}{/td}
{td}Allows you to create a list with bullets.{/td}
{td}See below{/td}
{td}See below{/td}
{/tr}
{/table}
Above in the table I said to see down here about the code tag, well you went too far. If you study the code for the table, you will see the code tags. As I said earlier it is futile to try and put code tags around code tags so this is the best I can do. Now on to quotes. Look below and see two kinds of quotes. The first is to be used when quoting someone here, usually in the next post. The second is used generally when quoting someone from elsewhere on the internet.
Quoting me
Quoting someone else.
And now the code for the quotes, both types.
[quote author=Hoov link=topic=11325.msg95794#msg95794 date=1312219626]
Quoting me
[/quote]
[quote]
Quoting someone else.
[/quote]And now the list tag.
Test List
and the code for the list.
Test List
[list][li]Test 1[/li]
[li]Test 2[/li]
[li]Test 3[/li]
[/list]But there is also a different way of doing Lists. And that is provided below. It adds a parameter to the List tag so that you can change the bullet in front of each line.
PARAMETER can take one of the following values: disc (standard bullet), circl, square, decimal, decimal-leading-zero, upper-roman, lower-roman, upper-alpha, lower-alpha
SUBLIST:
produces
* One
o Alpha
o Beta
o Gamma
* Two
* Three
OR with
- something in the list goes here
...and for a sub menu:
- something here from the list
PARAMETER can take one of the following values: disc (standard bullet), circl, square, decimal, decimal-leading-zero, upper-roman, lower-roman, upper-alpha, lower-alpha
[list type=lower-alpha]
[li]One[/li]
[li]Two[/li]
[li]Three[/li]
[/list]
SUBLIST:
[list type=upper-alpha]
[li]One
[list type=lower-roman]
[li]Alpha[/li]
[li]Beta[/li]
[li]Gamma[/li][/list][/li]
[li]Two[/li]
[li]Three[/li]
[/list]
produces
* One
o Alpha
o Beta
o Gamma
* Two
* Three
OR with [BR]
[list][*]something in the list goes here[/list]
...and for a sub menu:
[list][*]something here from the list[br][list][*]then something else here[/list][/list]
