Class Three: Difference between revisions
No edit summary |
|||
Line 195: | Line 195: | ||
|Dog || [[Image:Dog.jpg|100px]] | |Dog || [[Image:Dog.jpg|100px]] | ||
|} | |} | ||
===Others=== | |||
Tables can accept all sorts of parameters. The whole table can get an argument, like <code>class="wikitable"</code>, or you can give a row an argument if you put the parameter after <code>|-</code>, or an individual cell can get a parameter if you preface it with the parameter and a pipe. Here are some other parameters, and an example of them in action: | |||
<pre><nowiki>{| style="background-color:lightblue" align="center" border="1" | |||
|+'''Delicious table''' | |||
! | |||
!Why is it delicious? | |||
|- align="right" | |||
|height="100px"|Pizza ||Cheese | |||
|- | |||
|style="background-color:pink"|Ice cream with chocolate sprinkles ||style="color: red"| Sugar | |||
|}</nowiki></pre> | |||
{| style="background-color:lightblue" align="center" border="1" | |||
|+'''Delicious table''' | |||
! | |||
!Why is it delicious? | |||
|- | |||
|height="100px"|Pizza ||align="left"|Cheese | |||
|- | |||
|style="background-color:pink"|Ice cream with chocolate sprinkles ||style="color: red"| Sugar | |||
|} | |||
There's a lot more to discover, if you're still curious! | |||
==Templates== | ==Templates== |
Revision as of 21:56, 8 July 2012
Wiki-editing Class | ||
Example pages | ||
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:
{| |}
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.
{| |Pizza |}
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:
{| class="wikitable" |Pizza |}
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.
{| class="wikitable" |+Delicious table |Pizza |}
Pizza |
Bue in the mwith 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 |
.
{| class="wikitable" |+Delicious table |Pizza |- |Ice cream with chocolate sprinkles |}
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.
{| class="wikitable" |+Delicious table |Pizza || Cheese |- |Ice cream with chocolate sprinkles || Sugar |}
Pizza | Cheese |
Ice cream with chocolate sprinkles | Sugar |
Okay! Now this looks seriously like a table, don't you agree? Bue 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.
{| class="wikitable" |+Delicious table ! !Why is it delicious? |- |Pizza || Cheese |- |Ice cream with chocolate sprinkles || Sugar |}
Why is it delicious? | |
---|---|
Pizza | Cheese |
Ice cream with chocolate sprinkles | Sugar |
And there you have it! You can do all sorts of things from this basic table! I'll give some examples, now.
Examples
Add a new row
{| class="wikitable" |+Delicious table ! !Why is it delicious? |- |Pizza || Cheese |- |Ice cream with chocolate sprinkles || Sugar |- |Pie || Fat |}
Why is it delicious? | |
---|---|
Pizza | Cheese |
Ice cream with chocolate sprinkles | Sugar |
Pie | Fat |
Add a new column
{| class="wikitable" |+Delicious table ! !Why is it delicious? !Bad for you? |- |Pizza || Cheese || |- |Ice cream with chocolate sprinkles || Sugar || |}
Why is it delicious? | Bad for you? | |
---|---|---|
Pizza | Cheese | Shut up |
Ice cream with chocolate sprinkles | Sugar | Go away I'm eating |
Add images
{| class="wikitable" |+Delicious table ! !Why is it delicious? |- |Pizza || Cheese |- |Ice cream with chocolate sprinkles || Sugar |- |Dog || [[Image:Dog.jpg|100px]] |}
Why is it delicious? | |
---|---|
Pizza | Cheese |
Ice cream with chocolate sprinkles | Sugar |
Dog |
Others
Tables can accept all sorts of parameters. The whole table can get an argument, like class="wikitable"
, or you can give a row an argument if you put the parameter after |-
, or an individual cell can get a parameter if you preface it with the parameter and a pipe. Here are some other parameters, and an example of them in action:
{| style="background-color:lightblue" align="center" border="1" |+'''Delicious table''' ! !Why is it delicious? |- align="right" |height="100px"|Pizza ||Cheese |- |style="background-color:pink"|Ice cream with chocolate sprinkles ||style="color: red"| Sugar |}
Why is it delicious? | |
---|---|
Pizza | Cheese |
Ice cream with chocolate sprinkles | Sugar |
There's a lot more to discover, if you're still curious!