In Which Order Should Tags Be Inserted - Part 2: Link & Color Tags

I talked in the previous post about tags insertions, how to do it correctly & the restriction with the [img] tag, as it should always be the closest to the element (image URL) it wraps, see: In Which Order Should Tags Be Inserted - Part 1.

Let's talk now about restriction concerning the [url] & [color] tags:

1. [url] tag when wrapping a link without the use of an option:

To learn everything about [url] tag, check this post: Insertion of Live Links.

To do simple, & to get what I mean by [url] tag used with an option, see the example below (the link in red is the option):

[url=http://learn-bbcode.blogspot.com/]Learn Forums bbCode Secrets[/url]

Final look:

Learn Forums bbCode Secrets

While a [url] tag used without an option looks like this:

[url]http://learn-bbcode.blogspot.com/[/url]

Final look:

http://learn-bbcode.blogspot.com/

In the second example, & always when [url] tag wraps directly a link without use of option, & if you want to combine it with other tags, [url] tag must be the closest to the hyper-link it wraps, or else an error would occur in your final message.

Example:

[b][url]http://learn-bbcode.blogspot.com/[/url][/b] - Right

[url][b]http://learn-bbcode.blogspot.com/[/b][/url] - Wrong

2. [url] tag when used with an option:

a. [img] tag has to be closer to the image link:

I talked in detail about that in: In what order to insert tags - part 1.

b. [color] tag closer to the text wrapped:

Often, the use of options with [url] tag is made to be able to wrap text & make it clickable, i.e. linked to web-pages or sites, if additionally you want to give that text a spacial color, you need to use [color] tag (read about this tag here: How to Change Colors).

To be sure that your color will appear after you submit your post, the color tag have to be closer to the text wrapped than the [url] tag.

Example:

[url=http://learn-bbcode.blogspot.com/][color=red]Learn Forums bbCode Secrets[/color][/url] - Right

[color=red][url=http://learn-bbcode.blogspot.com/]Learn Forums bbCode Secrets[/url][/color] - Wrong

With the exception of the cases above, tags work fine when combined with [url] tag no matter in which order they are inserted.

Changing Forums Messages Colors - bbCode Basics

We talked about text style Bold, Italic, Underline, let's talk now about colors!

Usually the text in Forums has a default color that depends according to the theme, background color etc, but you're allowed to change the colors of your messages completely or partly using bbCode.

To change color is easy, you just need the tag [color] to wrap your text, but here, there's something else to set in addition to the starting tag [color] & the end tag [/color], I talked generally about this additional element in my intro:

... tags can have various options, for example for different colors, text sizes, etc.

certainly the [color] tag alone won't change the text color, it needs an option to specify the desired color, the option is added into the opening tag after a "=" sign, so that it looks like this:

[color=option]

Now, what to put instead of the word "option" in the sample above?

Each color in HTML has a code, those are used in bbCode as well.

For the basic colors, & even some more complicated, you can simply put color's name as the code,

You have one word names: Black, Grey, White, Blue, Green, Red, Yellow, Orange, Brown, Purple, Sienna, Navy, Indigo ...

& some composed names: DarkGreen, SeaGreen, DarkOliveGreen, DarkSlateBlue, SandyBrown ...

You can always use the editors that most of forums offer to select the color you want with one click after you select the part of your message you want to colorize.

Now what about the millions of other colors?

Each color has its own unique code of six characters that can be used into the [color] tag. For example the code for Blue is 0000ff, in the [color] tag, you type the symbol "#" before it, so that:

[color=#ooooff]This is Blue[/color]

and

[color=blue]This is Blue[/color]

Will give us the same result:

This is Blue

Want to add more style?A Bold & Blue text for instance? Easy:

[B][color=#ooooff]This is Blue[/color][/B] or [color=#ooooff][B]This is Blue[/B][/color] (Always the first opened tag closed last, checkout: How to Correctly Insert Tags)

Will look:

This is Blue

Checkout THIS for a list of 216 colors called "web safe", each is displayed in two lines, but you should type it in one line & preceded with the symbol "#" as shown in the example above.

For the many other colors, you can find & select the codes in Photoshop or other graphics editors, or you might use Pixie, a great little Freeware, get it from HERE.