Monday, September 17, 2007

How to Correctly Insert Tags - bbCode Basics

I've mentioned this in other lessons, but better to talk about it in detail.

Often you need to combine several tags in some part of the text to change different aspects of it (color, style & font for example), in this case, it's important to close the first tag opened last, so that it wraps the text to format & also all the tags inserted after it,or else you may get some unpredictable results.

To understand better, let's first talk about some basics:

To get the effect needed on text, tags have to wrap this text, that's why they are inserted in two parts, the first, the "opening tag" in the beginning of the content and the second, the "closing tag", in the end of the content.

The closing tag differ from the opening tag by a "/" symbol (forward slash) added into it, let's see an example:
For the tag used to give strong emphasis to the text, we have:

[B] - Opening Tag

[/B] - Closing Tag

Use to wrap text:

This part is plain, [B]this part is bold[/B] & this is plain.

Result:

This part is plain, this part is bold & this is plain.


Now how to combine tags?


Better to use an example:


Let's say we want our text Bold & Blue (more about colors HERE), we have two options to insert tags:

This way:

This part is plain, [B][color=blue]this part is bold & blue[/color][/B] & this is plain.

Or this way:

This part is plain, [color=blue][B]this part is bold & blue[/B][/color] & this is plain.

In both the result is the same, the following:

This part is plain, this part is bold & blue & this is plain.

Always the first tag opened is the last one closed!


Then the following two examples are wrong:
This part is plain, [B][color=blue]this part is bold & blue[/B][/color] & this is plain.

This part is plain, [color=blue][B]this part is bold & blue[/color][/B] & this is plain.

Those kinds of combinations may give the needed results sometimes (which, I agree, is the most important), but still it's a wrong coding and often will mess up your posts.

2 comments:

Vj said...

Thanx..dear..i was in great need of this..

Anonymous said...

This has been a great help so easy to understand, but could you tell me how to put a space between letters eg

[b][color=red]T[/color][color=blue]H[/color][color=green]A[/color][color=yellow]N[/color][color=white]K[/color][color=blue]Y[/color][color=orange]O[/color][color=red]U[/color][/b]

I want a space between thank and you, thanks for any help