|
Tags: Mobile edit Mobile web edit |
| (One intermediate revision by the same user not shown) |
| Line 1: |
Line 1: |
| {{mosnav|p=Typography and punctuation|c=Typography and punctuation}}
| | #REDIRECT [[Help:Tables]] |
| {{sc|T:TABLES}}
| |
| A lot of users get confused when it comes to '''making tables'''. Therefore, we've tried to make table creation a very easy process by creating a standard format. You should always try to follow the simple table creation process outlined on this page so that our wiki has a consistent look to its tables.
| |
| | |
| ==Table basics==
| |
| Tables are created on this wiki through the use of wikicode, which substitutes a few simple symbols for HTML expressions. Understanding these symbols is thus a good starting point.
| |
| {|class=wikitable style="width:50%"
| |
| !Symbol||What it does
| |
| |-
| |
| |<tt><nowiki>{|</nowiki></tt> || '''starts''' a table
| |
| |-
| |
| |<tt><nowiki>|}</nowiki></tt> || '''ends''' a table
| |
| |-
| |
| | <tt>!</tt> || declares that this row will define '''column header(s)'''
| |
| |-
| |
| | <tt><nowiki>||</nowiki></tt> || declares the '''end of a cell'''
| |
| |-
| |
| | <nowiki>|</nowiki> || declares the '''start of a new row'''
| |
| |-
| |
| | <nowiki>|-</nowiki> || declares the '''end of a row'''
| |
| |-
| |
| |}
| |
| | |
| What's really important here is the '''difference between a pipe (|) and an exclamation point (!).''' If you start the second line of your table — that is, the line that has all the column titles — with a pipe, you'll still get a table. But the resulting table will have no true header.
| |
| | |
| For instance, an awful lot of tables '''wrongly''' use the pipe like this:
| |
| | |
| <pre>
| |
| {| {{prettytable}}
| |
| | Writer || Director || Producer
| |
| |-
| |
| | Russell T Davies || Euros Lyn || Phil Collinson
| |
| |-
| |
| |}
| |
| </pre>
| |
| | |
| This produces the following:
| |
| | |
| {| {{prettytable}}
| |
| | Writer || Director || Producer
| |
| |-
| |
| | Russell T Davies || Euros Lyn || Phil Collinson
| |
| |-
| |
| |}
| |
| | |
| Okay, that's a table, technically. But it's got no header. See how you can mouseover the first row just as easily as the second? That shouldn't be happening.
| |
| | |
| What you need to do, therefore, is to actually declare the writer/director/producer line as the '''table header'''. You do this by beginning that line with an exclamation mark, not a pipe. Here's the ''right'' way to make a table with wikicode:
| |
| <pre>
| |
| {| {{prettytable}}
| |
| ! Writer || Director || Producer
| |
| |-
| |
| | Russell T Davies || Euros Lyn || Phil Collinson
| |
| |-
| |
| |}</pre>
| |
| | |
| It's a tiny change. But notice the '''dramatic''' difference in the output:
| |
| {| {{prettytable}}
| |
| ! Writer || Director || Producer
| |
| |-
| |
| | Russell T Davies || Euros Lyn || Phil Collinson
| |
| |-
| |
| |}
| |
| | |
| Notice that you can, if you wish, use multiple exclamation points:
| |
| {| {{prettytable}}
| |
| !Method A || Method B
| |
| |-style=vertical-align:top;padding:10px
| |
| |style=padding:10px;|You can start the line with an exclamation point and then separate each new header with double pipes like this:<pre>! Writer || Director || Producer</pre>
| |
| |style=padding:10px|Or you can put one header per line, and start each line with an exclamation point. It's the same thing.<pre>! Writer
| |
| !Director
| |
| !Producer</pre>
| |
| |-
| |
| |}
| |
| | |
| == Getting fancier ==
| |
| Can you make your table code fancier? It's technically possible, but it's not recommended. Now that we have CSS table code — and we've only had it since early 2012 — it's best that you just use the simple markup in the above section. Our goal is to try to make all the tables look the same. Of course, you'll find tables that look a bit different. These were created in the first six years of the wiki's life. They are slowly being converted to the above format.
| |
| | |
| == Prettytable vs. wikitable ==
| |
| {{tlx|prettytable}} used to mean something different than it does now. Now it means the same thing as a <tt>class=wikitable</tt> statment. So these two statements are essentially equivalent:
| |
| *<code><nowiki>{| {{prettytable}}</nowiki></code>
| |
| *<code><nowiki>{| class="wikitable"</nowiki></code>
| |
| [[Category:The Hub]] | |
| [[Category:Help]]
| |
