THE BASIN

Basin Home

Diablo II Home

Welcome Mat

Recommended Reading

FAQ

Guides

Tools & Links

The Stash

Basin D2 Wiki

Forums

WeaselTech

Formatting Posts

How ib Codes Work

The Basin forums are run with Invision Power Board software.  ib codes are the code conventions used as part of the Invision Board programming.  Even if you have no prior experience with a computer language, ib codes are easy to understand and simple to use.

If you are not already familiar with ib codes, you can quickly learn what they are and how to use them by reading:

How ib Codes Work

All of the specific ib codes available to you are set out below, with the proper syntax to use each one.

Bold, Italics, and Underline

The simplest and most frequently used ib codes are the ones that format text in bold, italics, and/or underlining.  To apply them just place the opening and closing tags on either side of the text you want them to affect.  The tags are:

To create a post that displays like this:

You would type the post like this:

Strikethrough

The ib code for strikethrough font uses the same syntax as the other formatting codes (bold, italics, etc.), and the tag is:

That post then displays like this:

Although strikethrough is easy to use it's frequently overlooked and is a good effect to have in your bag of posting tricks.

Font Size

You can use the SIZE code to increase the size of your fonts.  As with the formatting fonts we just saw, you enclose the text you want to modify with the opening and closing SIZE tags.  But the SIZE tag has an added wrinkle to it, because it requires you to insert a value in the opening tag: The value of what size you want the affected text to be.

The syntax for the SIZE code is:

where the value is a number representing the font size you want.  The pull-down menu above the Post Window gives you shortcut options to pick from three font sizes: "Small" (which is 1, and the default font size in the standard Basin skin); "Large" (7); and "Largest" (14).  You can manually set the size anywhere up to 23, a truly humongous font size.  You can type in an even higher value, but when you publish your post the server resets it to 23.  You can also manually set font sizes lower than 1; you can even set the size to a negative number, although doing so gives a new meaning to the term, "fine print."

Changing the Font Family

Use the FONT code to set text in your post to whatever font family you want.  The syntax is:

where the value is the name of a font family: Arial, Times, Courier, etc.  The pull-down Font menu above the Post Window gives you a group of font families to choose from, but you can manually insert any font family.  Check the fonts available in your word processor or in the preference settings for your browser to see many more possible families.  Be aware, though, that your selection will not display properly for anyone whose browser does not recognize the font you select.

Adding Colors

You can set the text in your posts to any of dozens of different colors.  You can apply color settings to all the text in your post, or to any particular passage.  So long as you exercise restraint, customizing the colors of your text is one of the easiest and most effective ways to jazz up your posts.  The syntax for the COLOR code is:

where the value is the name of the color you want.

The pull-down COLOR menu above the Post Window gives you a small number of color selections and automatically inserts the corresponding color tag for whichever one of them you pick.  But those selections are quite limited, and you will often want to pick a color that isn't on that menu.  To do that, you simply type in the COLOR tag manually and insert the name of the color you want in the opening COLOR tag between the "=" sign and the "]" symbol.

You designate a color in either of two ways:  By its text name or by its hex code.  Each available color has both an English (text) name and a hex code.  For example, the name for the background color on the Basin's D2 site pages is maroon; the hex code for that color is 800000.

To see the enormous range of colors available, with both the text name and hex code for each of them, go here:

Color Table

An easy way to insert the name or hex code of a color you choose from that table is to highlight the name or hex code with your mouse, copy it (Ctrl-C), switch to the Post Window for the post you are creating, and paste it (Ctrl-V) into the opening COLOR tag.

Whenever you go hunting for colors be sure to preview them in the Post Preview window.  How any particular color displays can depend dramatically on the background color, the size of the font, and the font family.  Some colors may look great in a color patch but make for virtually unreadable text when applied to your post.

Bullet Points

You can create bullet lists and bullet paragraphs by taking advantage of the LIST code.  The syntax is:

As this syntax suggests, the bullet effect is created by a combinations of codes.  The opening and closing LIST tags enclose the section of text that you want to display as bulleted text.  The [*] code is used to create each bullet.

The LIST button in the Post Window launches an input window that does the formatting automatically:  You simply type the text you want for each separate bullet segment, pressing ENTER after each item.  Hit ENTER twice to end the bullet list, and all of your text appears with proper ib codes in the Post Window.

The [*] code can be used by itself as well.  It is the only ib code that has no closing tag.  You simply type the three characters [  - *  - ] wherever you want a bullet to appear.  The server interprets the code as commanding a line break and inserting a circle-bullet at the point where the code is placed.

Inserting Codes While You Draft Posts

ib codes are surprisingly forgiving, compared to other software languages.  ib codes are not case sensitive, so it makes no difference whether you designate bold text with any of these sets of tags:

or

or

Another advantage of ib codes is that strict nesting is usually not necessary.  Nesting is the ordering of different sets of tags so that whenever one tag opens inside of another pair it also closes within that other pair.  Using bracket pairs to illustrate, these brackets are nested:

Whereas these bracket pairs are not:

Particularly with font formatting tags (bold, italics, and underline), you aren't likely to have any problems if individual pairs of tags overlap without nesting.  Where you can have trouble, though, is when formatting tags overlap with ib codes that require or permit values (url links, quotes, and some of the other codes discussed below), or when you have three or more levels of overlapping tags.  If you are having trouble making your tags work the way you want, try nesting them to solve the problem.

A much more frequent problem than a nesting conflict occurs when one of your tag pairs isn't closed at all.  If, for example, you open an Italics tag and then forget to close it (or mis-type the closing tag, which is just as much a problem as forgetting it entirely), then all of your text after the [i] tag will be italicized.  Whenever you type a post and hit "Preview Post" or "Add Reply" and then see that your post looks wildly different than you intended, the culprit is almost always a tag that isn't properly closed.

The post drafting interface gives you a choice of how to get your tags inserted into your text:  Manually, with shortcut keys, or -- at least in theory -- automatically.  The manual method is, of course, just a matter of typing in each letter and symbol.  The automatic method involves typing the text of your post and clicking on the ib code buttons above the Post Window as you type.  Thus, to open an Italics tag you can type the three keystrokes [ - i  - ], or you can put your cursor where you want the italics to start and click the square gray I button in the post drafting interface.  Instantly the tag [I] appears at your cursor location.  Each of the other ib code buttons works the same way.

While those buttons are a convenient and virtually infallible way to open ib tags, they aren't quite so reliable about closing them.  The Invision Board software includes some artificial intelligence to know which tags are open and when to close them instead of opening more.  But the program's artificial intelligence isn't terribly intelligent, and if you use the buttons to insert your codes you will often need to go back and manually close tags that remain open.  If you nonetheless like having the server do as much of the tag preparation as possible, enable the "Guided Mode" radio button to the upper-left of the Post Window.  Then whenever you click on any of the tag buttons it will launch an input box so that you only need to type in the values and text between the ib code tags.

Akin to the method of automatically inserting the ib codes by clicking buttons, you have a third option:  Shortcut keys.  By this method, to insert a Bold tag you simply hold down the Alt key and hit "b".  The shortcut key for the Italics tag is Alt-i.  For Underline, it's Alt-u.

Although some of the other ib codes have shortcut keys, be cautious that you know them first.  If you are typing a post and hit Alt-s expecting to insert a SIZE tag, you'll be surprised as your screen goes blank while your post is instantly published: Alt-s is actually the shortcut key for submitting the post you are working on.

Unfortunately, the shortcut keys are not supported by all browsers.  If you find they don't work for you, then you're stuck with the manaul and button insert methods.