o8. Coding for Beginners

Since many of our students are likely to be young or inexperienced with forum-based websites like ours, we have put together a crash course on the most basic form of coding available on the forum: BBCode. BBCode is the coding of choice for most beginners on these forums. You can use HTML as well, but unless you are WELL-VERSED in it, I don't recommend it.

Fun facts about BBCode.

✫BBCode, or Bulletin Board Code, is a lightweight markup language used to format posts in many message boards. The available tags are usually indicated by square brackets ([ ]) surrounding a keyword.

✫ BBCode was devised to provide a safer, easier and more limited way of allowing users to format their messages. As opposed to using HTML, which could lead to dangerous XSS attacks

✫ Although the basic tags of BBCode are similar in most internet forum software, there is currently no standardized document for BBCode.

Our Standard of BBCode and some Examples.

Most of the codes that are frequently used are available via the buttons at the top of the message-posting screen, and work well enough. Hovering your cursor over one of these buttons will show you a preview of the code that you will use, as well as what it can be used for. For those of us that educate ourselves in the code or use it every day, however, it tends to be easier not to work around the different buttons when we can type it.

Below, is a list of the commonly used codes, how to create them, and their effects!

1. BOLD.

Code:

[b]Bolded text[/b]

✫ Created by typing between the

Code:

[b][/b]

brackets.
✫ This is an example of how it should look.

2. ITALICS.

Code:

[i]Italicized text[/i]

✫Created by typing between the

Code:

[i][/i]

brackets
✫ This is an example of how it should look.

3. UNDERLINE.

Code:

[u]Underlined text[/u]

✫Created by typing between the

Code:

[u][/u]

brackets
✫ This is an example of how it should look

4. STRIKETHROUGH.

Code:

[strike]Strikethrough text[/strike]

✫Created by typing between the

Code:

[strike][/strike]

brackets
✫ Example of how it should look

5. URL.

Code:

[url]http://example.org[/url]

✫Created by typing between the

Code:

[url][/url]

brackets
✫ Example: lightwayacademy.forumotion.com

6. LINKING.

Code:

[url=http://example.org]Click here for the site[/url]

✫Created by typing between the

Code:

[url=][/url]

brackets
✫ This is an example of how it should work. Click the text between the linking code to be transported to the site.

7. IMAGES.

Code:

[img]directimagelinkhere[/img]

✫ Created by typing between the

Code:

[img][/img]

brackets
✫ Example:

8. QUOTE.

Code:

[quote]Quoted text[/quote]

✫Created by typing between the

Code:

[quote][/quote]

brackets and also available by post in the upper right-hand corner of every post to quote that post to respond to
✫

Quote :

This is an example of how a quote will appear.

9. CODE.

Code:

[code]coded text here[/code]

✫Created by typing between the

Code:

[code][/code]

brackets
✫ This is an example of how the code for an image should look when you put it between code brackets. Notice how you don’t see the image, just the code:

Code:

[img]http://i.imgur.com/bXQIt.png[/img]

10. TEXT SIZE.

Code:

[size=15]Text size 15.[/size]

✫Created by typing between the

Code:

[size][/size]

brackets
✫ This is an example of size 29 text; 29 is the biggest text size available on the site.

11. FONT.

Code:

[font=Times New Roman]Times New Roman font.[/font]

✫Created by typing between the

Code:

[font=][/font]

brackets
✫ You need to know the exact name of a font to make it work on the forum, and not all fonts may be accepted on all computers. Here is an example text that has been transformed into Comic Sans MS font.

11.COLOR

Code:

[color=blue]Blue text[/color] OR [color=#FF0000]Red text[/color]

✫Created by typing between the

Code:

[color=][/color]

brackets
✫ Both HTML color names and hexadecimal color values are supported. Here is an example of green text.

12. LIST.

Code:

[list] [*]Entry 1 [*]Entry 2[/list]

✫Created by typing between the

Code:

[list] [*]Entry[/list]

brackets
✫

• This
• is
• what
• it
• should
• do
• 

13.SPOILER

Code:

[spoiler]anything you would like to be clicked to be shown[/spoiler]

✫Created by typing anything between the

Code:

[spoiler][/spoiler]

brackets
✫You must click the word spoiler to see what is inside the spoiler; typing spoiler= into the first code will let you make the spoiler title anything you want.

This is an example:

14. RIGHT ALIGN

Code:

[right]Right aligned text[/right]

✫Created by typing anything between the

Code:

[right][/right]

brackets
✫

This is an example of right-aligned text.

15. LEFT ALIGN

Code:

[left]Left aligned text[/left

✫Created by typing anything between the

Code:

[left][/left]

brackets
✫

This is an example of left-aligned text.

16. CENTER

Code:

[center]Centered text[/center]

✫Created by typing anything between the

Code:

[center]Centered text[/center]

brackets
✫

This is an example of centered text.

11. JUSTIFY

Code:

[justify]Justified text[/justify]

✫Created by typing anything between the

Code:

[justify][/justify]

brackets
✫ For an example of justified text, look up at the block of text at the beginning of the page. See how it is all aligned within a box instead of chunky like a paragraph might look on a Word Document? This is what the justify option does.

Our Standard of BBCode and some Examples.

✫Always always ALWAYS close your coding if you open a code. If you type:

Code:

[color=green]Green

then you MUST close it for the coding to work properly, as so:

Code:

[color=green]Green[/green]

Broken coding is VERY yucky, nevermind confusing to look at.

✫ If you type multiple codes, such as

Code:

[size=12][color=blue][b]

to create size 12, blue-colored, bolded text, you must close them in the opposite order that you entered them

Code:

[size=12][color=blue][b][/b][/color][/size]

and, again, you MUST close ALL codes for the coding to work properly.

✫ When in doubt, PREVIEW! At the bottom of the posting window, right next to the Send button, there is a preview button! If you click this, it will show you what your post will appear as which show if your coding worked/didn’t work, or if you forgot to close any codes!

✫If you are having any issues with coding please ask someone, like one of the administrators, or your group moderator, who I’m sure will be happy to help!