BB Code Help [Post Code for your Board]

[akulion]

Hi

I wrote this lil article for my board to help users who are in experienced with using BB codes and end up making a mess by posting huge links and weirdly formatted posts lol

If you wish to use it feel free to post this article in your 'support' board. I entitled my topic as "Making the most out of your post"

So this isnt exactly a block code snippet - but rather a post text which may help others out geting them accustomed to BB codes on forums.

The Text for the post is in this text file - download by right clicking - copy and paste into a topic on your board to display


This is how the post appears


Hello everyone,

Lately I have noticed that a lot of members get a little confused using BB codes.

What are BB codes? BB stands for Bulletin Board, these are the codes we use to center, italicize, bold, etc text, to insert images and links and all that stuff.

So I decided to write a small tutorial on BB codes so people can make use of it by learning insha'Allah.

===============BB Codes Tutorial===============

The most basic thing we need to understand is that all BB codes have a start and an end.

The start of any BB code is with tags like so [ ]

The end is always with a slash inside the tag like so [ /]

There are always some words inside which are the actual commands, for example

To center a text we put the starting and ending BB codes around that word like so:

Code: [Select]


[center]
Word goes here
[/center]


The above code produces the following result:

Word goes here

I hope everyone understood that? Because thats important to know!

Now the second thing to understand is "nesting"

Dont worry you wont have to build any nests lol, its a simple concept really

Imagine a BB code as a paper glass. The stuff that we put between the starting and finishing tag is the drink or content.

But if we want to put 3 paper glasses into each other what do we do?

We nest them into each other...so one goes into the other!

Same way with BB codes, one goes into the other and never haphazardly!

Take this example of 2 BB codes nested into each other, here we bold a text and then center it.

Code: [Select]


[center]
[b]
Hello everyone
[/b]
[/center]


The result of the above BB code is as follows:

Hello everyone

Now notice the center and /center tags ENCLOSE the b and /b tags..that is called nesting...We finish LAST what we began FIRST so that everything starts and ends inside it to make the effect last over the entire code.

Another example using 4 codes this time:

Code: [Select]


[center]
[b]
[i]
[size=20pt]
Hello everyone
[/size]
[i]
[/b]
[/center]


The result:

Hello everyone

Of course keep in mind for the sake of demonstration I have put all the codes in seperate lines, in actuality you will be probably doing it like so:

Code: [Select]


[center][b][i][size=20pt]Hello everyone[/size][i][/b][/center]


But if you prefer to use new lines, it will still work

================Inserting Images and Links===============

1. Inserting an image is very easy.. to insert images we use the

img and /img tags

Please keep in mind when I say the word TAGS, it means the word is inside square brackets like so:

Code: [Select]


[img] and [/img]


To insert an image we simply put its address in between the start and end tags like so:

Code: [Select]


[img]
Http://www.whatever.com/image1.gif
[/img]


2. To create a link out of a lengthy address we use the:

url= and /url tags

Like so:

Code: [Select]


[url=http://www.whatever.com]
WORD FOR LINK GOES HERE
[/url]


Now notice in the above tag the address actually goes into the beginning tag itself!

3. Inserting an image and linking it

Now what if we want to put a picture and make the picture into the link?

Then we use NESTING of the 2 tags like this:

Code: [Select]


[url=http://www.whatever.com]
[img]
Http://www.whatever.com/image1.gif
[/img]
[/url]



===============Other Tags===============

There are various tags, and are pretty straight forward...when composing a message you can always use the buttons in the writing box when you hit reply

Or if you want to be fluent you can memorize these tags which are nearly similar for all types of forums....

*keep in mind tags mean these are enclosed in square brackets

Italicize

We use i and /i tags

Bold

We use b and /b tags

Underline

We use u and /u tags

Strike Through

We use s and /s tags

Font Size

We use size=XXpt and /size tags

Here XX stands for any 2 digit number, it can also be 1 digit..always make sure you put pt after the number

Horizontal Line

We simply put HR inside square brackets, this tag does not have an ending tag!

Like so:

Code: [Select]


[hr]


it produces a horizontal like like below


Anyways that ends this short tutorial...there are many other tags...just explore and you will discover them yourself

Press the REPLY button and reply to this post and you can play around with the Buttons and see what all types of BB codes there are

Questions are also welcome, please post them here.

[alan s]

Nice guide , would help if you didnt know any bbc or html. Theres another guide like that floating around somewhere aswell i think

[RoarinRow]

What's a BBC?     Just kidding, this is great!  I take it for granted everyone knows this, but not all do.

Thanks!