Welcome to Standard Editing Procedure - Sasukepedia Results. Finally, we have reached the end. Now, don't get your hopes up and breath that sigh of relief just yet. The results aren't exactly friendly to anyone, whether they be complete newbies to wiki editing, or well versed veterans of the art and science. Since results are used on generally every article type on Sasukepedia, the use of results are very important to this wiki. As such, we will be going through the details of the different types of results that we use based on article type, as well as the proper results table coloring that will be used on all results tables regardless of article type.
If you don't know any CSS (cascading style sheets) coding, you will be getting your first hands on with it here. Don't worry, once you're done with this page of the manual, you should be fine.
Results Table Basics
Basic Construction
All results tables, are essentially nothing more than, "wikitables", a built in function of the mediawiki software, using it's available parameters to suit our specific needs here on Sasukepedia. For the most part, we build a wikitable as any wiki editor would on any wiki, the only real differences being the adjustment of colors, widths for columns, and categories in the top row that define the columns.
Creating a Wikitable
Wikitables, start out the same, with a singular brace "{", followed by a pipe "|" (shift + backslash), and then followed by the words class="wikitable". Those three portions; the brace, pipe, and class="wikitable"; tells the wiki to create a table. Options beyond this, are essentially optional, and can be adapted to suit virtually any table-based need on a wiki. Finishing a table, requires a user to "close" the code of the table, so the wiki knows that no other information is to be included in the table (and won't mess up the remainder of the article's formatting)
{|class="wikitable"
Columns, & Rows
In order to create a title row, which essentially defines the categories for your columns, you're going to want to move down to the next line (row). Now, there's two options to go by on this row; and regardless of which you choose, style options will be available for every row and column at any point before adding plain text. For one, you can go plain and have a simple table with no real difference in definition of column or row content. Or, you could make the "first row" be your "title row", which bolds text in the title row, essentially making it easier for readers to see what each row and column is all about. Setting the width in this title row, is ideal; reasoning being that it will control the width of that column, no matter how many rows down it is.
- To create the special "title row", all you have to do is start it out with an exclamation point, !, followed by wikitable formatting options.
- To create a regular row, all you have to do is start out with a pipe, |, followed by wikitable formatting options.
Once you've decided on a title row, or regular row, and added some wikitable formatting options; add another pipe, |, followed by the plain text you would like to have in that box (column & row).
"Title" Row
!width="15%" style="background-color: #4D0503;"|Color Code
- "Title" row exclamation point.
- Width option set to 15%.
- Style option set to change background color to 4D0503 (very dark red, title row).
- Pipe telling mediawiki that there's no more options for this row.
- Plain text to be rendered with the previous options.
"Regular" Row
|align="center" style="background-color: #721410;"|'''721410'''
- "Regular" row set by a pipe.
- Text alignment option set to center.
- Style option set to change background color to 721410 (light red, alternating color 1).
- Pipe telling mediawiki that there's no more options for this row.
- Plain text to be rendered with the previous options.
Continue to add these until you have filled out all the columns in a row. Once you have all the columns of a row filled out, move on to a line break, and then repeat your rows/columns as needed. Eventually, move down to closing the wikitable.
Line Breaks
By moving down a line, without adding a proper wikitable linebreak, you will continue to create new columns. In order to prevent this, a proper linebreak is required to move down to the next row, so that you may fill out the columns in that new row. In order to create a line break, all you need to do is move down to a new line, and add a pipe and dash,
|-
Closing a wikitable
Finishing a wikitable is quite simple. Remember the singular brace and pipe following it, that was used to start the wikitable? Yea? Cool. Reverse it. What? Oh, sorry, I'll show you. Pipe, followed by brace.
|}
One thing to note however, if there isn't already one available, add a line break immediately before the closing of a wikitable, just to make sure that it formats properly.
Options
Width
One of the easiest, and seemingly redundant options, is the table width. Following the brace and pipe, but preceding the class option; we insert the width option for the table, which in this case would be width="100%". Seeing as how these are results tables, we're going to want to stretch the width out to 100% of the article's available width. With that in mind, simply placing the width option to 100% would be the correct option here.
width="100%"
It is important to note that when places in the very beginning of the table, the width option will affect the width of the table as a whole, as opposed to the individual columns. Applying a width to a column is very possible, and used quite often here on Sasukepedia, it's all a matter of formatting properly on an as-needed basis.
Style
There are a lot of options within the Style class, but we're only going to be going into background color, as that's the only real style option we use here on Sasukepedia. To use background colors, you're going to add it to your row options as
style="background-color: #$$$$$$;"
Replace the 6 dollar signs ($) with a 6-character color "hex" code, such as 4D0503 (very dark red, title row), 721410 (light red, alternating color 1), 530B09 (dark red, alternating color 2), or BC8A1F (gold-ish yellow, used for "clear"ing a stage, or achieving kanzenseiha).
Text Alignments
Aligning text to a certain position is both simple, and required for all results templates. Adding alignment is as simple as adding the following to your row options, typically the first option since it's the smallest option you will use.
align="center"
Wikitable Example & Analysis
This is the same table that is used in the "Color Scheme" section at the bottom of this article, exception being that the "very dark red" and "clearing stages" rows have been removed.
Example
{|width="100%" class="wikitable"
!width="15%" style="background-color: #4D0503;"|Color Code
!width="25%" style="background-color: #4D0503;"|Color Description
!width="60%" style="background-color: #4D0503;"|Use in the Tables
|-
|align="center" style="background-color: #721410;"|'''721410'''
|align="center" style="background-color: #721410;"|Light red
|align="center" style="background-color: #721410;"|Alternating color #1.
|-
|align="center" style="background-color: #530B09;"|'''530B09'''
|align="center" style="background-color: #530B09;"|Dark red
|align="center" style="background-color: #530B09;"|Alternating color #2.
|-
|}
Analysis
{|width="100%" class="wikitable"
- Basic requirements for a wikitable.
- Opening brace and pipe.
- Width options.
- Class, telling mediawiki that this is a wikitable.
!width="15%" style="background-color: #4D0503;"|Color Code
- "Title" row, note the ! starting the row.
- Width option set to 15%.
- Style options for row colors, 4D0503 being a "title row" color.
- Pipe to tell mediawiki that there are no more options for this row.
- Plain text to be rendered with the options before the pipe.
!width="25%" style="background-color: #4D0503;"|Color Description
- "Title" row, note the ! starting the row.
- Width option set to 25%.
- Style options for row colors, 4D0503 being a "title row" color.
- Pipe to tell mediawiki that there are no more options for this row.
- Plain text to be rendered with the options before the pipe.
!width="60%" style="background-color: #4D0503;"|Use in the Tables
- "Title" row, note the ! starting the row.
- Width option set to 60%.
- Style options for row colors, 4D0503 being a "title row" color.
- Pipe to tell mediawiki that there are no more options for this row.
- Plain text to be rendered with the options before the pipe.
|-
- Line break, telling mediawiki that there are no more columns, move to next row.
|align="center" style="background-color: #721410;"|'''721410'''
- "Regular" row, note the | (pipe) starting the row.
- Text alignment option set to center.
- Style options for row colors, 721410 being an alternating row color.
- Pipe to tell mediawiki that there are no more options for this row.
- Plain text to be rendered with the options before the pipe.
|align="center" style="background-color: #721410;"|Light red
- "Regular" row, note the | (pipe) starting the row.
- Text alignment option set to center.
- Style options for row colors, 721410 being an alternating row color.
- Pipe to tell mediawiki that there are no more options for this row.
- Plain text to be rendered with the options before the pipe.
|align="center" style="background-color: #721410;"|Alternating color #1.
- "Regular" row, note the | (pipe) starting the row.
- Text alignment option set to center.
- Style options for row colors, 721410 being an alternating row color.
- Pipe to tell mediawiki that there are no more options for this row.
- Plain text to be rendered with the options before the pipe.
|-
- Line break, telling mediawiki that there are no more columns, move to next row.
|}
- Basic requirements for a wikitable.
- Closing pipe and brace, telling mediawiki that the table is complete.
Sasukepedia Construction
Sasukepedia doesn't exactly have custom options, as much as we do custom values for basic wikitable formatting options. With that in mind, formatting rows and columns at specific widths, text alignments, and background colors.
Row & Column width
These options, will be variable based on individual articles. Typically, each table only has about 3-4 columns each, with the first one or two columns requiring very little width, and the other two requiring a bit more. It's best to just use common sense in deciding which columns should get more space as opposed to others. There's no standardized width numbers at this point in time.
Text Alignments
This is pretty simple. We use centered text in all results, at all times. Never left or right, always centered.
Color Scheme
| Color Code | Color Description | Use in the Tables |
|---|---|---|
| 721410 | Light red | Alternating color #1. |
| 530B09 | Dark red | Alternating color #2. |
| 4D0503 | Very dark red | Title & summary rows. |
| BC8A1F | Gold-ish yellow | Clearing stages, or "winning". |
Other Options for Wikitable Construction
Seeing as how this tutorial is meant specifically for the results of competitors success and failures in obstacles and competitions; we will be sticking to Sasukepedia-related options only. If you would like to know more, beyond the scope of this tutorial, please take a look over at Wikipedia's wikitable help.
See Also
| ||||||||||||||||||||||