Template:Navbox/doc

This is a documentation subpage for Template:Navbox. It contains usage information, categories and other content that is not part of the original template page.

{{Navbox}} allows a navigational template to be set up relatively quickly by supplying it with one or more lists of links. It is the standardisation of navigational templates, and made for ease of use. It comes equipped with default styles that should work for most navigational templates. Changing the default styles is possible, but not recommended.

This is one of the most complicated templates on the wiki to edit.

Usage

Please remove the parameters that are left blank.

{{Navbox
| name       = {{subst:PAGENAME}}{{subst:void|Don't change anything on this line. It will change itself when you save.}}
| title      =
| state      = {{{state|}}}

| above      =
| image      =

| group1     =
| list1      =

| group2     =
| list2      =

| group3     =
| list3      =

<!-- ... -->

| below      =
}}

Parameter List

The navbox uses lowercase parameter names, as shown in the box (above). The required name and title will create a one-line box if other parameters are omitted.

Notice "group1" (etc.) is optional, as are sections named "above/below".

The basic and most common parameters are as follows (see below for the full list):

• |name= – the name of the template.
• |title= – text in the title bar, such as "[[Characters]]".
• |listclass= – a CSS class for the list cells. Alternatively, use |bodyclass= for the whole box.
• |state= – controls when a navbox is expanded or collapsed: defaulted to collapsed.
• |titlestyle= – a CSS style for the title-bar, such as: background: gray;
• |groupstyle= – a CSS style for the group-cells, such as: background: #eee;
• |above= – text to appear above the group/list section (could be a list of overall wikilinks).
• |image= – an optional right-side image, coded as the whole image. Typically it is purely decorative, so it should be coded as [[File:Example.jpg|80px|link=|alt=]].
• |imageleft= – an optional left-side image (code the same as the "image" parameter).
• |groupn= – the left-side text before list-n (if group-n omitted, list-n starts at centre of box).
• |listn= – text where listing wikilinks will be shown.
• |below= – optional text to appear below the group/list section.

Parameter Descriptions

The following is a complete list of parameters for using {{Navbox}}. In most cases, the only required parameters are |name=, |title=, and {{para|list1, though child navboxes is entirely optional.

Setup Parameters

• |name=

The name of the template, which is needed for the "v • t • e" links to work properly on all pages where the template is used. You can enter {{subst:PAGENAME}} for this value as a shortcut. The name parameter is only mandatory if a title is specified, and the border parameter is not set, and the navbar parameter is not used to disable the navbar.

• |state=[collapsed, autocollapse, expanded, plain, off]

Defaults to collapsed. A navbox with collapsed will always default to having the navbox closed.

• If set to autocollapse, the navbox will start out collapsed if there are two or more tables on the same page that use other collapsible tables. Otherwise, the navbox will be expanded.
• If set to expanded, the navbox will always start out in an expanded state.
• If set to plain, the navbox will always be expanded with no [hide] link on the right, and the title will remain centered (by using padding to offset the v • t • e links).
• If set to off, the navbox will always be expanded with no [hide] link on the right, but no padding will be used to keep the title centered. This is for advanced use only; the "plain" option should suffice for most applications where the [show]/[hide] button needs to be hidden.

• |navbar=

If set to plain, the v • t • e links on the left side of the titlebar will not be displayed, and padding will be automatically used to keep the title centred. Use off to remove the v • t • e links, but not apply padding (this is for advanced use only; the "plain" option should suffice for most applications where a navbar is not desired). It is highly recommended that one not hide the navbar, in order to make it easier for users to edit the template, and to keep a standard style across pages.

• |border=

See later section on using navboxes within one another for examples and a more complete description. If set to child or subgroup, then the navbox can be used as a borderless child that fits snugly in another navbox. The border is hidden and there is no padding on the sides of the table, so it fits into the list area of its parent navbox. If set to none, then the border is hidden and padding is removed, and the navbox may be used as a child of another container (do not use the none option inside of another navbox; similarly, only use the child/subgroup option inside of another navbox). If set to anything else (default), then a regular navbox is displayed with a 1px border.

Cells

• |title=

Text that appears centred in the top row of the table. It is usually the template's topic, i.e. a succinct description of the body contents. This should be a single line, but if a second line is needed, use {{-}} to ensure proper centering. This parameter is technically not mandatory, but using {{Navbox}} is rather pointless without a title.

• |above=

A full-width cell displayed between the titlebar and first group/list, i.e. above the template's body (groups, lists and image). In a template without an image, above behaves in the same way as the list1 parameter without the group1 parameter.

• |groupn=

(i.e. group1, group2, etc.) If specified, text appears in a header cell displayed to the left of list_n. If omitted, list_n uses the full width of the table.

• |listn=

(i.e. list1, list2, etc.) The body of the template, usually a list of links. At least one list parameter is required; each additional list is displayed in a separate row of the table. Each list_n may be preceded by a corresponding group_n parameter, if provided (see below).

• |image=

An image to be displayed in a cell below the title and to the right of the body (the groups/lists). For the image to display properly, the list1 parameter must be specified. The image parameter accepts standard wikicode for displaying an image, e.g.:

[[File:Example.jpg|80px|link=|alt=]]

nb: including "|right" will produce the usual left margin to provide separation from the list items and zebra striping.

• |imageleft=

An image to be displayed in a cell below the title and to the left of the body (lists). For the image to display properly, the list1 parameter must be specified and no groups can be specified. It accepts the same sort of parameter that image accepts.

• |below=

A full-width cell displayed below the template's body (groups, lists and image). In a template without an image, below behaves in the same way as the template's final list_n parameter without a group_n parameter. For an example of the below parameter in use, see {{Navbox Characters}}.

Style parameters

Styles are generally advised against, to maintain consistency among templates and pages throughout the Len'en Wiki; but the option to modify styles is given.

• |bodystyle=

Specifies CSS styles to apply to the template body. This option should be used sparingly as it can lead to visual inconsistencies. Examples:

bodystyle = background: #nnnnnn;

bodystyle = width: N [em/%/px or width: auto];

bodystyle = float: [left/right/none];

bodystyle = clear: [right/left/both/none];

• |basestyle=

CSS styles to apply to the title, above, below, and group cells all at once. The styles are not applied to list cells. This is convenient for easily changing the basic color of the navbox without having to repeat the style specifications for the different parts of the navbox. Examples:

basestyle = background: lightskyblue;

• |titlestyle=

CSS styles to apply to title, most often the titlebar's background color:

titlestyle = background: #nnnnnn;

titlestyle = background: name;

titlestyle = background: none; — for no background color

• |groupstyle=

CSS styles to apply to the groupN cells. This option overrides any styles that are applied to the entire table. Examples:

groupstyle = background: #nnnnnn;

groupstyle = text-align: [left/center/right];

groupstyle = vertical-align: [top/middle/bottom];

• |groupnstyle=

CSS styles to apply to a specific group, in addition to any styles specified by the groupstyle parameter. This parameter should only be used when absolutely necessary in order to maintain standardisation and simplicity. Examples:

group3style = background: red; color: white;

• |groupwidth=

A number and unit specifying a uniform width for the group cells, in cases where little content in the list cells may cause group cells to be too wide. No default. However, may be overridden by the group(n)style parameter. Examples:

groupwidth = 9em

• |liststyle=

CSS styles to apply to all lists. Overruled by the oddstyle and evenstyle parameters (if specified) hereafter. When using backgound colors in the navbox, see the note hereafter.

• |listnstyle=

CSS styles to apply to a specific list, in addition to any styles specified by the liststyle parameter. This parameter should only be used when absolutely necessary in order to maintain standardisation and simplicity. Examples:

list5style = background: #ddddff;

• |listpadding=

A number and unit specifying the padding in each list cell. The list cells come equipped with a default padding of 0.25em on the left and right, and 0 on the top and bottom. Due to complex technical reasons, simply setting "liststyle = padding: 0.5em;" (or any other padding setting) will not work. Examples:

listpadding = 0.5em 0; (sets 0.5em padding for the top/bottom, and 0 padding for the left/right.)

listpadding = 0; (removes all list padding.)

• |oddstyle=, |evenstyle=

Applies to odd/even list numbers. Overrules styles defined by liststyle. The default behavior is to add striped colors (white and red) to odd/even rows, respectively, in order to improve readability. These should not be changed except in extraordinary circumstances.

• |evenodd=[swap, even, odd, off]

If set to swap, then the automatic striping of even and odd rows is reversed. Normally, even rows get a light red background for striping; when this parameter is used, the odd rows receive the red striping instead of the even rows. Setting to even or odd sets all rows to have that striping colour. Setting to off disables automatic row striping.

• |abovestyle=, |belowstyle=

CSS styles to apply to the top cell (specified via the above parameter) and bottom cell (specified via the below parameter). Typically used to set background color or text alignment:

abovestyle = background: #nnnnnn;

abovestyle = text-align: [left/center/right];

belowstyle = background: #nnnnnn;

belowstyle = text-align: [left/center/right];

• |imagestyle=, |imageleftstyle=

CSS styles to apply to the cells where the image/imageleft sits. These styles should only be used in exceptional circumstances, usually to fix width problems if the width of groups is set and the width of the image cell grows too large. Examples:

imagestyle = width:5em;

Advanced parameters

• |bodyclass=, |aboveclass=, |groupclass=, |listclass=, |belowclass=

This enables attaching a CSS class to group or list cells.

• |titlegroup=

This puts a group in the title area, with the same default styles as group_n. It should be used only in exceptional circumstances (usually advanced meta-templates) and its use requires some knowledge of the internal code of {{Navbox}}; you should be ready to manually set up CSS styles to get everything to work properly if you wish to use it. If you think you have an application for this parameter, it might be best to change your mind, or consult the talk page first.

• |titlegroupstyle=

The styles for the titlegroup cell.

• |innerstyle=

A very advanced parameter to be used only for advanced meta-templates employing the navbox. Internally, the navbox uses an outer table to draw the border, and then an inner table for everything else (title/above/groups/lists/below/images, etc.). The style/bodystyle parameter sets the style for the outer table, which the inner table inherits, but in advanced cases (meta-templates) it may be necessary to directly set the style for the inner table. This parameter provides access to that inner table so styles can be applied. Use at your own risk.

Layout of Table

Without image, above and below

Table generated by {{Navbox}} without image, above and below parameters (gray list background color added for illustration only):

With image, above and below

Table generated by {{Navbox}} with image, above and below parameters (gray list background color added for illustration only):

With image and without groups

Table generated by {{Navbox}} with image, imageleft, lists, and without groups, above, below (gray list background color added for illustration only):

Examples

No image

 {{Navbox
 |name =Navbox/doc
 |title =[[Characters]]

 |group1 =Forgettable Characters
 |list1 =[[Suzumi Kuzu]] • [[Adagumo no Saragimaru]] • [[Kaoru Kashiwagi]] • [[Clause]]
 |group2 =Notorious Characters
 |list2 =[[Shion]] • [[Adagumo no Yaorochi]] • [[Clause]] • [[Suzumi Kuzu]]
 |group3 =Powerful Characters
 |list3 =[[Tsurubami Senri]] • [[Xeno a]] • [[Suzumi Kuzu]] • [[Tenkai Zuifeng]] • [[Clause]]
 }}

With image, without groups

 {{Navbox
 |name =Navbox/doc
 |title =[[Characters]]
 |image =[[File:Le01TitleScreen.jpg|175px]]

 |list1 =[[Suzumi Kuzu]] • [[Adagumo no Saragimaru]] • [[Kaoru Kashiwagi]] • [[Clause]] • [[Adagumo no Yaorochi]] • [[Tsurubami Senri]] • [[Xeno a]] • [[Tenkai Zuifeng]]
 }}

With two images, without groups, multiple lists

 {{Navbox
 |name =Navbox/doc
 |title =[[Characters]]
 |image =[[File:Le01TitleScreen.jpg|175px]]
 |imageleft =[[File:Le02TitleScreen.jpg|175px]]

 |list1 =[[Suzumi Kuzu]] • [[Adagumo no Saragimaru]] • [[Kaoru Kashiwagi]] • [[Clause]]
 |list2 =[[Shion]] • [[Adagumo no Yaorochi]] • [[Clause]] • [[Suzumi Kuzu]]
 |list3 =[[Tsurubami Senri]] • [[Xeno a]] • [[Suzumi Kuzu]] • [[Tenkai Zuifeng]] • [[Clause]]
 }}

With image, groups, above, below

 {{Navbox
 |name =Navbox/doc
 |title =[[Characters]]
 |above = Above text goes here
 |image =[[File:Le01TitleScreen.jpg|175px]]

 |group1 =Forgettable Characters
 |list1 =[[Suzumi Kuzu]] • [[Adagumo no Saragimaru]] • [[Kaoru Kashiwagi]] • [[Clause]]
 |group2 =Notorious Characters
 |list2 =[[Shion]] • [[Adagumo no Yaorochi]] • [[Clause]] • [[Suzumi Kuzu]]
 |group3 =Powerful Characters
 |list3 =[[Tsurubami Senri]] • [[Xeno a]] • [[Suzumi Kuzu]] • [[Tenkai Zuifeng]] • [[Clause]]

 |below =Below text goes here
 }}

Child/Subgroup navboxes

It is possible to place multiple navboxes within a single border by using "child" or "subgroup" as the first parameter, or by setting the border parameter. The basic code for doing this is as follows (which adds a subgroup for the first group/list area):

{{Navbox
| name = {{subst:PAGENAME}}
| title = Title

| group1 = [optional]
| list1  = {{Navbox|child
   ...child navbox parameters...
 }}
...
}}

Subgroups example

This example shows two subgroups created using child as the first unnamed parameter. The striping is alternated automatically. To remove the striping altogether, you can set liststyle = background:transparent; in each of the navboxes. This is best used to further categorise links into certain sections.

Multiple show/hides in a single container

The example below is generated using a regular navbox for the main container, then its list1, list2, and list3 parameters each contain another navbox, with 1 = child set. The view (v), discuss (t), edit (e) navbar links are hidden using navbar = plain for each of them, or could be suppressed by just leaving out the name parameter (child navboxes do not require the name parameter to be set, unlike regular navboxes).

Intricacies

• The 2px wide border between groups and lists is drawn using the border-left property of the list cell. Thus, if you wish to change the background color of the template (for example bodystyle = background:purple;), then you'll need to make the border-left-color match the background color (i.e. liststyle = border-left-color: purple;). If you wish to have a border around each list cell, then the 2px border between the list cells and group cells will disappear; you'll have to come up with your own solution.
• The list cell width is initially set to 100%. Thus, if you wish to manually set the width of group cells, you'll need to also specify the liststyle to have width: auto. If you wish to set the group width and use images, it's up to you to figure out the CSS in the groupstyle, liststyle, imagestyle, and imageleftstyle parameters to get everything to work correctly. Example of setting group width:

|groupstyle=width: 10em;

|liststyle=width: auto;

• Adjacent navboxes have only a 1 pixel border between them (except in IE 6, which doesn't support the necessary CSS). If you set the top or bottom margin of style/bodystyle, then this will not work.
• The default margin-left and margin-right of the outer navbox table are set to "auto;". If you wish to use navbox as a float, you need to manually set the margin-left and margin-right values, because the auto margins interfere with the float option. For example, add the following code to use the navbox as a float:

bodystyle = width: 22em; float: right; margin-left: 1em; margin-right: 0;

See also

• {{Infobox}}
• {{Navbar}} — Used for the navigation links in navbox.