Wiki:Tables  

< Documentation

Table Example

Our Example Table

Col. 1	Column 2	Col. 3
item	column width defaulted to ~60%	item

The code that made the above table:

{| width="100%" border="1" cellspacing="0"
|+'''Our Example Table'''
! width="20%" | Col. 1 
! Column 2 !! width="20%" | Col. 3
|-
| item 
| column width defaulted to ~60% || item
|}

Code Breakdown

Here is the above code broken down into what each part means.

Code Fragment	Explanation
{|	Begin a wikitable. many of the standard options found in a HTML table tag can be used here.
|+	Caption
|-	Row break
!	Header
! width="20%" |	Header with options
!!	Header break on same line
|	New cell
||	Separate cells on the same line
|}	End of table

Contents [hide]

Table Example Code Breakdown Class and Style Table Classes Row Classes Cell Classes Special Classes History

NOTE: For the curious, the table, above, is using class="infobox" and border="1"

In addition to the above explanation of wiki-tables, it should be mentioned that HTML tables also work in the wiki, and in fact, SHOULD be used exclusively in templates. Transcluding a wiki-table (from a template) into a wiki-table (on a page) can do some strange things, so as a rule of thumb, templates should not use wiki-tables.

Class and Style

The classes defined in the following sections should be defined in EVERY skin here at ZAM, so you can use them on any page and, if that page is viewed on a different skin than the game it was designed for, it should still look good and be readable.

PLEASE avoid using custom colors on wiki pages except where ABSOLUTELY needed, and be sure to talk to JerekDain or Bludwyng about it, first! We may be able to suggest an already existing style you can use.

• Make sure you check out Wiki Table Style Guide to check out how the table changes appearance when you change skins.
• You can also check out Tables in Action to see how each table's class appears compared to each other to find the table style suitable.

Table Classes

See this page for examples, but basically all tables in the wiki should use no color styling except for that provided by one of the following classes:

• none - In wiki, a table with no class or styling is invisible.
• datatable - Use this on plain lookup tables (works well with sortable)
• infobox - This should only be used once on a page, generally in a template, near or at the top of the page. Other tables on the page should use datatable.
• rounded5 - Adds 5px rounding to tables (except on Internet Explorer)
• rounded10 - Adds 10px rounding to tables (except on Internet Explorer)
• sortable - has no styling of its own, so it should always be added to another style, preferably infobox or datatable. This will only work on simple tables with no sub-header cells. Just keep it simple and it should work fine.

Row Classes

• .lr and .dr - Use class="lr" or class="dr" on alternating rows of a table to produce hi-lighting.

Cell Classes

These can be used on any table element, table, row, or cell, to set the background and foreground colors. They will be adjusted to be consistent with the primary skin colors on the game you are viewing it on.

• lightbg
• medbg
• darkbg

Special Classes

There are a few more classes that were created for very specific uses, but can be used in other ways.

• credit, creditlt, and creditdk - "credit" is for credit templates, and creditlt and creditdk both style the text and link colors based on a white (creditlt) or black (creditdk) background color. The background is not set, and does not have to be white or black, but the text and link colors are defined to be readable on those 2 standards.
• gametag - Intended for the GameTag's that Bludwyng makes for each game we support. See GameTag.
• frdialogue - Designed for use on Free Realms, it is defined for all skins and actually looks very good on many of them.

History

This is based on a page I originally wrote at EQ2i. --[bludwyng (contribs)]

ZAM credits this article at EQ2 Wikia for some of the info in this article. Licensed under the GFDL.