Infoboxes

Infoboxes are visual elements, typically in the upper-right-hand corner of wiki pages, that contain useful at-a-glance information about an article's subject.

Example infoboxes

• 

  Yi Ling on the ARK wiki

• 

  Tribe minion on the Neutronized wiki

• 

  Guo Si on Wikipedia

• 

  Extension:CustomLogs on mediawiki.org

Infoboxes can be styled in a variety of ways and can contain many different types of information.

How to define an infobox

Infoboxes are defined inside of templates. There are three main ways you can define an infobox inside of a template on wiki.gg.

DRUID infoboxes

DRUID infoboxes rely on Module:Infobox (copy this to your wiki) and supporting resources at Gadget - druidInfoboxes.css and Gadget - druidInfoboxes.js to create an extensible framework in which you can define your own infoboxes.

Portable infoboxes

Portable Infoboxes rely on Extension:PortableInfoboxes (preinstalled on every wiki) to enable the creation of XML-based infoboxes.

DIY infoboxes

Infoboxes are nothing more than a table and accompanying styles, so you can also define your own infoboxes without relying on either of the above. This is recommended for anyone with some frontend-development experience who wants full control over the resulting HTML, but if you aren't comfortable writing code, you should probably rely on one of the above methods.

Here is how a small snippet of a DIY infobox might look:

{{#if:{{{atk_spd|}}}|<!--
 --><tr class="infobox-row"><!--
  --><th class="infobox-label">Attack speed:</th><!--
  --><td class="infobox-data">{{{atk_spd}}}%</td><!--
 --></tr><!-- end if 
-->}}

This snippet checks if a parameter called atk_spd is defined by the user filling out the infobox; if so it prints a table row with a header cell saying "Attack speed:" followed by a content cell saying "X%" where X is the value specified by atk_spd. You can then customize the display via .infobox-row, .infobox-label, and .infobox-data.

Additional infobox data

In addition to displaying the infobox, infobox templates often do a couple other things at the same time:

• Add some categories to the page (for example, Infobox:Item might add Category:Items to every single page it's used on)
• Store Cargo