Style guides

This page is a style and formatting guideline on GuildWars Wikia.

It has general acceptance among editors and is considered a standard to which articles should adhere. However, it is not set in stone and should be treated with common sense and the occasional exception.

GuildWiki provides us with custom CSS classes to help us format articles more easily. They are stored in MediaWiki:Common.css. You can override or modify this with your own CSS by putting it in your borwser's style sheet(s), using MyPage/Monaco.css or MyPage/Monobook.css (depending on your default skin), or by placing it in w:Special:MyPage/global.css to be active for all skins on all Wikia wikis.

Wikia-predefined CSS classes

These classes change color automatically with the theme.

no class link
color1 link
color2 link
neutral link
accent link
dark_text_1 link
dark_text_2 link
avatar link
WikiaArticleCategories link
button link
secondary button link

Profession colors and table (cell) formatting

The following formatting can be applied to any elements, including tables and table cells.

<span class=warrior>       warrior </span><br />
<span class=ranger>        ranger </span><br />
<span class=monk>          monk </span><br />
<span class=necromancer>   necromancer </span><br />
<span class=mesmer>        mesmer </span><br />
<span class=elementalist>  elementalist </span><br />
<span class=assassin>      assassin </span><br />
<span class=ritualist>     ritualist </span><br />
<span class=paragon>       paragon </span><br />
<span class=dervish>       dervish  </span><br />
<span class=no-profession> no-profession  </span><br />


Table formatting and alignment classes

Standard table format

The class stdt will apply our standard table format. This can be seen on most of the tables on the wiki.

Top-aligned table

The class aligntop applies style="vertical-align:top" to all cells in the table; this can be overridden for individual cells, of course. alignbottom aligns bottom.

Armor crafting table

The class armorcraftingbox applies special alignment to specific columns for tables that detail the crafting costs of armor. This can be seen on any of our armor articles, such as Warrior Ascalon armor.

Navbox table

The class navbox applies text and color formatting for our navboxes.

Sortable table

The class sortable creates a table with icons that let you sort columns. You can use the classes unsortable and sortbottom to further customize this display. It can be combined with other classes, such as stdt.

{|class="stdt sortable"
|1||Z||02-02-2004 ||5.00||This
|2||y||13-apr-2005||    ||Column
|5||V||05/12/2006 ||7.15||See?
!Total: 15!!!!!!Total: 29.55!!
Numbers Alphabet Dates Currency Unsortable
1Z02-02-2004 5.00This
2y13-apr-2005 Column
5V05/12/2006 7.15See?
Total: 15Total: 29.55

Collapsible table

The class collapsible makes a whole table collapsible. It looks best when the table has a single cell in the top row; use colspan to achieve that. Requires Javascript.

{| class="collapsible stdt"
!Header!!More Header
|more cell
HeaderMore Header
Cellmore cell

Hiding table columns

Classes hidecol1 ~ hidecol10 hide the specified columns in the table. It can be useful for copying-pasting rows from one table to another table that has similar general layout but differ in few columns (so no need to modify the rows per table), or when you use table content templates designed for a table with more columns. Avoid using this feature if possible.

Note: These classes rely on Javascript in IE6 to compensate for CSS compatibility issues

{| class="aligntop stdt hidecol2"
| short cell
|second column
| long
| more
| second column, too
| short cell
short cell second column long
second column, too short cell

Limit TOC display depth

Classes toc1 to toc6 limit the outline depth of the TOC, displaying subheading farther left than they would usually be. Example:

<div class="toc3">__TOC__</div>
== Example h2 header ==
=== An h3 header ===
==== An h4 header ====
=== A second h3 header ===
===== An h5 header =====
Intentionally skipping a h4
====== An h6 header ======
==== A second h4 header ====

CSS example TOC

Example h2 header

An h3 header

An h4 header

A second h3 header

An h5 header

Intentionally skipping a h4

An h6 header

A second h4 header

Fake headers

The classes fakeh2 and fakeh3 will make any div look like a section header, but it doesn't show up in the table of contents and won't have a section link.

Dual lines inline

The class sig-stack allows two small lines to be stacked without breaking text flow.

note: this class may not work correctly in IE6

[[User:M.mendel|mendel]] <span class="sig-stack"><span>([[Special:Contributions/M.mendel|contribs]])</span><span> ([[User_talk:M.mendel|talk]]) </span></span> mendel(contribs) (talk)
<span class="sig-stack"><span>bottom line</span><span>top line</span></span> some random text some random text some random text some random text bottom linetop line some random text some random text some random text some random text

See also