Class Three

In this, the last class, we will learn how to create tables, as well as how to use some templates. Both of these things are very versatile, but can get very complicated. Even though you won't be a master of the subject when we finish, you should know enough to use basic tables and templates - and perhaps you'll be interested enough to keep learning on your own!

Tables

You're probably familiar with tables - a way of showing data arranged into columns and rows. They can be a useful way of working through options, and can even be helpful in making decisions. Here is a table, for example, about when it is a good idea to order a pizza:

Are you already eating a pizza?	Then you should...
No	Order a pizza, immediately.
Yes	Order a second pizza.

On the wiki, tables are used for a lot of things. They can get really complicated, so we'll just learn how to make one simple kind of table for now.

All tables begin with a {| and end with a |}. If you forget either of those sets of symbols, then the table will not work correctly. It's also important to remember that the {| must be at the start of a new line. If you try to start a table in the middle of a line, then it doesn't work.

So the first thing we do is lay out our table start and table end:

<code>{|

|}</code>

Now we have to add some data. We'll start with the simplest possible table: one cell of information. To build a cell, you just start with a pipe symbol, and then put in whatever information you want. All cells must start with a pipe symbol.

<code>{|
|Pizza
|}</code>

Now, this is a boring table. It's so boring, you actually can't even tell it's a table. Here it is:

Pizza

We can make it a little better - make it actually look like a table - if we tell the table to look different. We can do that by instructing it to look like a "wikitable," which is a standard and very common style of table. To do that, you just add class="wikitable" right after the table start. It's a sort of code word: that one little command is actually just the trigger for a whole bunch of hidden instructions, cached away elsewhere on the wiki.

So our table now looks like this in code:

<code>{| class="wikitable"
|Pizza
|}</code>

And that gives us this:

Pizza

Still very boring, but a little more like a table. Let's add a title. We do that with a plus sign, right after the start of the table. It has to come after a pipe, at the start of a new line.

<code>{| class="wikitable"
|+Delicious table
|Pizza
|}</code>

Delicious table

Pizza

But a table with one cell and a title still doesn't give more information. Let's add another row of information. To do that, we tell the table we want a new row with a |-, then we add the new row (which, remember, has to start with a |.

<code>{| class="wikitable"
|+Delicious table
|Pizza
|-
|Ice cream with chocolate sprinkles
|}</code>

Delicious table

Pizza

Ice cream with chocolate sprinkles

Now notice that the table has automatically expanded! Not only does it have a new row, but the entire table is bigger, to accommodate the length of the new data! Amazing! Now it's really starting to look like a table.

Let's add an entire new category of information, though. We'll add another column to the table. We do that by just expanding horizontally: just append a double pipe, || to the rows you want to expand.

<code>{| class="wikitable"
|+Delicious table
|Pizza || Cheese
|-
|Ice cream with chocolate sprinkles || Sugar
|}</code>

Delicious table

Pizza	Cheese
Ice cream with chocolate sprinkles	Sugar

Okay! Now this looks seriously like a table, don't you agree? But we want to label this information... what does "cheese" have to do with "pizza," for example? To add a label, we use an exclamation point near the start of the table. Each exclamation point will be the label for a column. So if you have two columns and you want to label both, you need two exclamation points. Also, we need a "new row" symbol after them, so the wiki understands exactly what we want.

I have two columns, but I only want to label the second. So I put two exclamation points at the start of two new lines at the top of the table, and put my desired label in the second one.

<code>{| class="wikitable"
|+Delicious table
!
!Why is it delicious?
|-
|Pizza || Cheese
|-
|Ice cream with chocolate sprinkles || Sugar
|}</code>

Delicious table

	Why is it delicious?
Pizza	Cheese
Ice cream with chocolate sprinkles	Sugar