This is a BBCode guide for the Science Olympiad Student Center, written by fishman100.

If anyone would like to help edit this they can!

BBCode, as it appears on the forums

*This Section Under Construction*

BBCode, the guide on the Wiki

A Guide to BBCode: Beginners
Written by: fishman100

Have you ever wondered “Wow, how did he make the text bolded?” or “Hmm, how did she post an image there?” This guide explains BBCode and how to properly use it when you are posting on scioly.org or any other similar forum.

The Basics

Like other guides, I will start out with the basics of BBCode.

First off, BBCode is an acronym. It really stands for Bulletin Board Code. The purpose of BBCode is to format your text easier. Some forums use HTML, but scioly.org doesn’t. BBCode is usually found on many forums or similar message boards. Don’t get that mixed up with IRC Chat; IRC is completely different!

You may not have known this but chances are you’ve probably used BBCode at least once while posting on our forums. If you’ve ever inserted an emoticon into a post or quoted someone, then you’ve used BBCode.

One thing you’ll notice right off the bat about BBCode is that it’s very different from standard HTML. For those of you that have a Facebook or Twitter or blog then you’ll know that if you want to post an image all you really need to do is paste the URL into your message box. However, BBCode is different.

BBCode requires the use of tags. Those tags act in a similar way to your brain. When you see something your brain analyzes it and performs the necessary actions. Well, in BBCode, the “brain” of the message sees the tags and modifies the text accordingly. There are many different tags that can be used, so make sure you’re using the right ones!

More About Tags

Now you know a little about tags and their role in your message. Let’s explore tags a little more.

When you go to insert a tag you can either do one of two things: type the tag out yourself, or click on one of the buttons at the top to insert the tag into the text for you. Here’s what I mean:

Now, what happens if I click on one the “B” button?

You’ll notice that when I clicked on the “B” button up top some funny brackets with a "b" in the middle was entered into the message body. Note: The tags are separated for photo editing purposes. When you actually click on the tags they will be entered side-by-side.

Well everyone…like the picture says, this is a tag!

That’s correct: these symbols are the tags:

[b]

[/b]

Clicking on any of the other buttons will basically give you the same thing: the two brackets with the letter(s) in the middle. So, if I clicked the “quote” button instead of the “B” button I would have the following tags:

[quote]

[/quote]

<Here is a screenshot of a tag that will make my text italicized:

You’ll see that in between the “LASER” and “Light Amplification by Stimulated Emission of Radiation” there are some funny brackets with i’s in between. What does that mean?

If you guessed it will make the text italicized, you’re right. It’s basically like the “B” and the “quote” button but instead of having the word “quote” or “b” in between the two brackets there’s an i. (You could make an educated guess that the “i” means “italicize”, anyways.)

When I add that specific tag to any post in any forum on scioly.org then the text in between those two “brackets with i’s” will automatically become italicized when I hit the “Submit” button. Most of the other tags operate in the same fashion: any text between those two tags will be modified by the tags.

Alright, to wrap up this section I will summarize: your tags are basically 2 pairs of brackets. Inside those brackets is/are a letter(s). The letter(s) determine the type of your text: italicized, bolded, quoted, etc. You’ll notice that in one of those bracketed pairs there’s a right slash (/) preceding the letter(s). What does that mean? That’s what the next section is about.

There’s a Right Slash!

While looking at the screenshots and reading this guide you might have noticed that in one of those bracketed pairs there’s a right slash (/) preceding the letter(s). For those of you who have not found this right slash yet, here's a screenshot to show you:

That right slash basically means “to end.” You remember that I told you that whatever text is in between the two tags will be modified, right? The first tag (the one on the left without the right slash) means “to start.” From that point until the other tag, anything in between the left tag and the right tag will be bolded. When you want to stop bolding the text you place the right-most tag (the one on the right WITH the right slash, as pictured above) after your last word. For example:

If I had the sentence “The vehicle may not exceed 12.000 kilograms when it is weighed” but I wanted to bold the “may not exceed 12.000 kilograms” then I would move the tag without the right slash right before the “may” and move the tag WITH the right slash directly after the “kilograms” to bold that part of the text.*

The vehicle [b]may not exceed 12.000 kilograms[/b] when it is weighed

When I entered the text, it would look like this:

The vehicle may not exceed 12.000 kilograms when it is weighed

Note: “The vehicle may not exceed 12.000 kilograms when it is weighed” is not an actual rule.

So, you place you tags directly before and after the word you want to start and end on to modify it.

All About the Tags: Names, Functions, and Abbreviations

Now that you know what a tag is and how to use one, it’s time to learn about all of the different tags, their functions, and their abbreviations above the message box.

Simple Tags

B: Makes the text bolded.
I: Makes the text italicized.
U: Makes the text underlined.
Quote: Quotes that text. Sometimes you may want to add the name of the person you’re quoting. To add the name of someone you’re quoting, place the username exactly how it is in the left tag. In that left tag, place an “equal” sign (=) directly after the “quote” word. After the equal sign, place the name of the person you’re quoting in quotation marks.
```
[quote="fishman100"]BBCode[/quote]
```
Code: Similar to the “Quote” function although instead of modifying the text it shows the tags without any modifications. This is useful if you have a wall of text in different fonts/colors, etc. and needs to be copied.
```
[b]Reach for the Stars[/b]
```
I could copy the two “bold” tags and the “Reach for the Stars” text now and paste it somewhere else.
Img: Allows you to insert an image by copying/pasting the image URL in between the two IMG tags.
```
[img]http://www.scioly.org/phpBB3/download/file.php?avatar=14579_1308349783.gif[/img]
```
Quote:
<img src="http://www.scioly.org/phpBB3/download/file.php?avatar=14579_1308349783.gif" alt="file.php?avatar=14579_1308349783.gif" />

NOTE: In order to post images you MUST copy/paste the image address/URL! If you try to copy/paste the image into the message body you’ll notice that nothing happens, even when you go to submit your image.
To copy the image URL/address, right click on the image you want to post. There will be an option, either “Copy Image URL” or “Copy Image Address”, etc. Then go to the message body and hit Control+v to paste the image address.
URL: Sometimes you’ll want to direct people to other threads. This is where the URL tag comes in handy! To provide a link to another page, simply copy/paste the page’s URL into the message box, and you’re done! Now, there is another way of posting a link. Instead of having the link separated somewhere in the message you can actually incorporate it into your text. This is done by modifying the URL tag a little. When you click on the URL tag button, this comes up:
```
[url][/url]
```
Now, to incorporate the link into your text you add an equal sign (=) directly after the “url” in the left tag. Rather than pasting your URL in between the two tags, paste your URL directly after the equal sign. Here is an example of correctly integrating the URL with your text:
```
The Forestry ID thread can be found [url=http://scioly.org/phpBB3/viewtopic.php?f=121&t=3067]here.[/url]
```
Quote:
The Forestry ID thread can be found <a href="http://scioly.org/phpBB3/viewtopic.php?f=121&t=3067">here.</a>
Profile: Creates a link to a profile. Place the name of the person’s profile you would like to link in between the two tags.
```
[profile]fishman100[/profile]
```
[profile]fishman100[/profile]
Gallery: Creates a link to an Image Gallery. Like the “Profile” tag, place the name of the event in between the two tags.
```
[gallery]Bottle Rocket[/gallery]
```
[gallery]Bottle Rocket[/gallery]
Normal: NOTE: This is actually a drop-down menu. This allows you to change the size of the font (see next section).
Tiny font:
```
[size=50]fishman100[/size]
```
fishman100 Small font:
```
[size=85]fishman100[/size]
```
fishman100 Large font:
```
[size=150]fishman100[/size]
```
fishman100 Huge font:
```
[size=200]fishman100[/size]
```
fishman100
Font colour: Allows you to change the color of the font. When you click on the “Font Colour” tag a box with multiple colors will pop up directly above the message box. Click on a color and it will be inputted into the message.
```
[color=#0000FF]Junkyard Challenge[/color]
```
Junkyard Challenge
You’ll notice that the color value for the “Junkyard Challenge” text above is “#0000FF.” That’s because it’s a shade of a basic color. Basic colors, such as red, purple, blue, and black (etc.) have their own value, but you can type them out by hand, too:
```
[color=green]Junkyard Challenge[/color]
```
Junkyard Challenge

More Advanced Tags

List: Makes you create a bulleted list. Place the things you want to list in between the two tags. However, when you go to submit your post then you’ll realize that there’s no list! You have to add a tag with asterisks for each thing you want to list. Here is the “asterisks tag”:
```
[*]
```
Place each listed item on its own line, each starting with the “asterisks tag.”
```
[list] [*]Guide 1
[*]Guide 2
[*]Guide 3[/list]
```
Quote:
- Guide 1
- Guide 2
- Guide 3
Alternatively you could list all of your listed items out in a single line, but keep the “asterisks tag” in front of each listed item.
```
[list] [*]Guide 1 [*]Guide 2 [*]Guide 3[/list]
```
Quote:
- Guide 1
- Guide 2
- Guide 3
List=: Create an advanced list. Instead of having a bulleted list you can replace the bullets with numbers or letters. After the equal sign (which is after the “List” in the left tag) you can place either a “1” or an “a” to determine which kind of listing will appear. Placing a “1” will result in a numbered list, while placing “a” results in an alphabetic list. Numbered list:
```
[list=1]
[*]Rocks and Minerals
[*]Towers
[/list]
```
Quote:
1. Rocks and Minerals
2. Towers
Alphabetic list:
```
[list=a]
[*]Rocks and Minerals
[*]Towers
[/list]
```
Quote:
1. Rocks and Minerals
2. Towers
Like the regular “List” function, you could place the listed items all in a single line; it doesn’t matter.
Best=: Creates a link to the “Best of <year>” (Best of 2010, etc.) image gallery. If you want to just create a link to the “Best of” for that year, place the year after the equal sign (which is after the “best” on the left tag). Then put a colon after the year and submit your message.
```
[best=2010:][/best]
```
This is optional, but you can place text after the left tag. For example:
```
[best=2010:]Images[/best]
```
Now, if you want to place a certain event from that year into the link, you place the event name after the colon. If the event name has a space, substitute the space(s) with an underscore.If the event ran in both divisions make sure you specify with division!
```
[best=2010:Trajectory_B]Trajectory B[/best]
```
[best=2010:Trajectory_B]Trajectory B[/best]
```
[best=2011:Mission_Possible_C]Mission Possible C[/best]
```
[best=2011:Mission_Possible_C]Mission Possible C[/best]
Remember, you don’t have to put anything in between the tags, but you should so that readers will know which event images they will be looking at.
[hide]Concerning text|I suppose you could put something foolish in between the tags, such as:
[best=2011:Sumo_Bots]asfghghgDF[/best]
But please don’t.[/hide]
Hide: Hides the text. In order to hide text, put your tags first. Then, in between the tags, place some sort of warning, etc. as to what the hidden text is (so if you have a large image or something you can hide it, and if you say “large image” then people will know the image is large when they see the hidden text). Then, place a “|” symbol directly after the ‘warning text.’ That symbol can be found above the keyboard. Press Shift+left slash (\) key to produce the symbol. Place your hidden text directly after the “|” symbol.
```
[hide]Click to display the current year!|The current year is 2012.[/hide]
```
[hide]Click to display the current year!|The current year is 2011.[/hide]
After you submit the message, you can display the text by clicking on the non-hidden text you typed in. In this example, the current year would be displayed if you clicked on the text that said “Click to display the current year!”
Math: Allows you to insert mathematical symbols/formulas into your message. In order to successfully insert a full formula in BBCode you must follow the <img src="http://scioly.geekshavefeelings.com/mathtex/mathtex.cgi?%5Ctext%5CLaTeX" alt="mathtex.cgi?%5Ctext%5CLaTeX" /> syntax, which can be found here: ftp://ftp.ams.org/pub/tex/doc/amsmath/short-math-guide.pdf
```
[math]x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}[/math]
```
[math]x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}[/math]
Rules: This tag is special. Rather than inserting text in between the two tags, you simply leave it blank. When you submit your message it will create a link to our forum rules.
Score: This is similar to the ‘Rules’ tag. Leave it blank, and when submitted, it will create a link to the scioly.org Score Tracker.
Test: Creates a link to a certain test from the Test Exchange. Creating a link to a test is similar to creating a link to the image gallery. One difference is the left tag does not have an equal sign after it. This means that you must place all of your text in between the two tags.

[test]2012:Chem Lab:Chem_Lab[/test]

[test]2012:Chem Lab:Chem_Lab[/test]

 [test]2011:Optics:Optics[/test]

[test]2011:Optics:Optics[/test]

Userpage: Creates a link to a userpage on the Wiki. This is similar to the “B” tag. You place the name of the user’s userpage from the Wiki in between the tags.

[userpage]fishman100[/userpage]

[userpage]fishman100[/userpage]

Wiki: This creates a link to a wiki page from the Wiki. This is also similar to the “B” tag. You place the name of the Wiki page you want in between the tags and it will create a link to that wiki page when the message is submitted.
```
[wiki]It's About Time[/wiki]
```
[wiki]It's About Time[/wiki]

There are more tags that aren’t listed here…see if you can find/use them all!

Review Questions

To make sure you know how to use BBCode, I have created some review questions. The answers hidden below.

1) Does scioly.org use HTML or BBCode?

2) Is the following a tag:

[u][/u]

3) In the coded example above, should you place the text you want to be modified before the first tag, after the second tag, or in between the two tags?
4) Where might you find an exception to this?
5) Create an alphabetic list with the following terms: Gold medal, Silver medal, and Bronze Medal.
Note: Some questions were removed due to formatting issues.

<spoiler text="Answers to the Review Questions"> 1) BBCode
2) Yes
3) Between the two tags
4) When you're quoting someone, integrating a URL within your text, creating a link to the “Best of” gallery, creating a link to the “Score Tracker” , and when you’re creating a link to the “Forum Rules.”

Gold medal
Silver medal
Bronze medal

Remember, it doesn’t matter if your list is one single line!

</spoiler>

Conclusion

Well, that basically wraps up this guide. To summarize:

Scioly.org uses BBCode, which stands for Bulletin Board Code
Tags are basically 2 pairs of brackets with a letter(s) inside.
The text will be modified depending on what the letter(s) is/are inside of the brackets.
You can type out some colors, such as
```
[color=red][/color]
```
instead of typing out the value (which is the pound sign followed by a series of numbers).
When integrating a URL with your text you need to change the tag a little.

To create a link to the test exchange:

[test]Year:Name:Name with any underscores[/test]

Add the “|” symbol to start hiding text.
Look here for a guide to LATEX writing.

Thanks for reading this guide. If you have any questions/comments/concerns/clarifications about this guide or BBCode then don’t hesitate to PM me (fishman100) via the forums or catch me on IRC (IRC username is usually IYIYTH).

Be sure to check out my next guide, which will be the Advanced Guide to BBCode!

~fishman100

General Competition Resources

About Scioly.org

Forums	BBCode Scioly Summer Study Session
Wiki	Help:Editing How to Write a Practice Test
General	Discord IRC (deprecated) History FAQ

Event Tools

Competition Help

Scioly.org:BBCode

Contents