Template:Navbox/doc: Difference between revisions

From 118Wiki
Jump to navigation Jump to search
m (vertical -> horizontal. Duh.)
(new stuff; parameter capitalisation; -underconstruction)
 
(2 intermediate revisions by the same user not shown)
Line 6: Line 6:


Minimal use:
Minimal use:
<pre>{{Navbox|TITLE=Title|Contents}}</pre>
<pre>{{Navbox|title=Title|Contents}}</pre>


The text within the template '''without parameter''' creates the contents of the navigation box.
The text within the template '''without parameter''' creates the contents of the navigation box.


Enter the parameter '''TITLE''' for the title of the navigation box.
Enter the parameter '''title''' for the title of the navigation box.


Other parameters are optional.
Other parameters are optional.
Line 16: Line 16:
Full use:
Full use:
<pre>{{Navbox
<pre>{{Navbox
|EXPANDED=Expanded
|expanded=
|WIDTH=Width
|width=
|TEXTCOLOR=Text color
|textcolor=
|TITLEBACKGROUND=Title background
|color=
|BACKGROUND=Background
|background=
|ALIGN=Align
|align=
|TITLE=Title
|title=
|bstyle=
|tstyle=
|cstyle=
|Contents}}</pre>
|Contents}}</pre>


'''EXPANDED''' determines if the navigation box is expanded or collapsed (open or closed) when the page is opened. Enter ''yes'' to have the navigation box expanded. Any other text or not using the parameter will default to collapsed box.
'''Expanded''' determines if the navigation box is expanded or collapsed (open or closed) when the page is opened. Any text (such as "yes", "true", "1") causes the box to be initially opened. Leave empty if that is not desired.


'''WIDTH''' determines the width of the navigation box. Enter the width in pixels (e.g. 150px), as percentage of the width of the article (e.g. 80%) or in other supported measures. Defaults to full width.
'''Width''' determines the width of the navigation box. Enter the width in pixels (e.g. 150px), as percentage of the width of the article (e.g. 80%) or in other supported measures. Defaults to full width.


'''TEXTCOLOR''' determines the color of the title. Enter the color in HTML names (e.g. white) or in hex code (e.g. #FEF7FC). Defaults to the black.
'''Textcolor''' determines the color of the title. Enter the color in HTML names (e.g. white) or in hex code (e.g. #FEF7FC). Defaults to the black.


'''COLOR''' determines the background color of the title. Enter the color in HTML names (e.g. black) or in hex code (e.g. #B57EDC). Defaults to #efefef, which is a shade of light grey.
'''Color''' determines the background color of the title. Enter the color in HTML names (e.g. black) or in hex code (e.g. #B57EDC). Defaults to #efefef, which is a shade of light grey.


'''BACKGROUND''' determines the background color of the content. Enter the color in HTML names (e.g. black) or in hex code (e.g. #B57EDC). Defaults to white.
'''Background''' determines the background color of the content. Enter the color in HTML names (e.g. black) or in hex code (e.g. #B57EDC). Defaults to white.


'''ALIGN''' determines the alignment of the contents. Defaults to left.
'''Align''' determines the alignment of the contents. Defaults to left.
 
'''Bstyle''', '''tstyle''' and '''cstyle''' allow changes to the CSS styling of the template main box, title box and contents, respectively. These parameters can override all other styling to their respective objects. These are advanced parameters that can cause the template to work incorrectly if entered wrong.
 
Different capitalisations of the parameter names ("title", "Title", "TITLE") are accepted. Please only use one style per parameter name.


== Examples ==
== Examples ==
Line 44: Line 51:


<pre>{{Navbox
<pre>{{Navbox
|ALIGN=center
|align=center
|TITLE=Species of the [[Borderlands]]
|title=Species of the [[Borderlands]]
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}</pre>
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}</pre>


{{Navbox
{{Navbox
|ALIGN=center
|align=center
|TITLE=Species of the [[Borderlands]]
|title=Species of the [[Borderlands]]
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}


=== More complex navigation box ===
=== More complex navigation box ===
<pre>{{Navbox
<pre>{{Navbox
|EXPANDED=yes
|expanded=yes
|WIDTH=400px
|width=400px
|ALIGN=center
|align=center
|COLOR=#996633
|color=#996633
|TEXTCOLOR=white
|textcolor=white
|TITLE=Species of the [[Borderlands]]
|title=Species of the [[Borderlands]]
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}</pre>
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}</pre>


{{Navbox
{{Navbox
|EXPANDED=yes
|expanded=yes
|WIDTH=400px
|width=400px
|ALIGN=center
|align=center
|COLOR=#996633
|color=#996633
|TEXTCOLOR=white
|textcolor=white
|TITLE=Species of the [[Borderlands]]
|title=Species of the [[Borderlands]]
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}


=== Alternate use ===
=== Alternate use ===
<pre>{{Navbox
<pre>{{Navbox
|COLOR={{Color|Blue}}
|color={{Color|Blue}}
|TEXTCOLOR=white
|textcolor=white
|WIDTH=80%
|width=80%
|TITLE=Shoreleave
|title=Shoreleave
|[[File:Classo.jpg|thumb|Rura Penthe is Class D, such as the moon above.]]
|[[File:Classo.jpg|thumb|Rura Penthe is Class D, such as the moon above.]]
After the mission in the Muppetverse, the crew of the USS ''Diana'' went to a shore leave on Rura Pethe. Exhausted by the events of the previous mission, Jo Venan decided to use the opportunity for relaxation, as opposed to joining the other officers in exploring their holiday destination. As such, she remained mostly onboard the ship.
After the mission in the Muppetverse, the crew of the USS ''Diana'' went to a shore leave on Rura Pethe. Exhausted by the events of the previous mission, Jo Venan decided to use the opportunity for relaxation, as opposed to joining the other officers in exploring their holiday destination. As such, she remained mostly onboard the ship.
Line 84: Line 91:


{{Navbox
{{Navbox
|COLOR={{Color|Blue}}
|color={{Color|Blue}}
|TEXTCOLOR=white
|textcolor=white
|WIDTH=80%
|width=80%
|TITLE=Shoreleave
|title=Shoreleave
|[[File:Classo.jpg|thumb|Rura Penthe is Class D, such as the moon above.]]
|[[File:Classo.jpg|thumb|Rura Penthe is Class D, such as the moon above.]]
After the mission in the Muppetverse, the crew of the USS ''Diana'' went to a shore leave on Rura Pethe. Exhausted by the events of the previous mission, Jo Venan decided to use the opportunity for relaxation, as opposed to joining the other officers in exploring their holiday destination. As such, she remained mostly onboard the ship.
After the mission in the Muppetverse, the crew of the USS ''Diana'' went to a shore leave on Rura Pethe. Exhausted by the events of the previous mission, Jo Venan decided to use the opportunity for relaxation, as opposed to joining the other officers in exploring their holiday destination. As such, she remained mostly onboard the ship.
Line 95: Line 102:
== Template data ==
== Template data ==


{{Navbox|title=Template Data|
<templatedata>
<templatedata>
{
{
Line 100: Line 108:
"1": {
"1": {
"label": "Contents",
"label": "Contents",
"description": "Contents of the box",
"description": "Contents shown in the box",
"type": "content",
"suggested": true
"suggested": true
},
},
"EXPANDED": {
"expanded": {
"description": "If yes, the box will be expanded when the page is accessed.",
"aliases": [
"suggestedvalues": [
"Expanded",
"yes",
"EXPANDED"
"no"
],
],
"default": "no"
"label": "Expanded",
"description": "If not empty, the box will appear expanded (open) when the page is opened. Leave empty if you want the box to be closed when the page is opened.",
"type": "string"
},
},
"WIDTH": {
"width": {
"description": "Width of the box.",
"aliases": [
"example": "200px"
"Width",
"WIDTH"
],
"label": "Width",
"description": "Width of the box. Use CSS measure units, e.g. pixels (px), em, %.",
"example": "500px",
"type": "line"
},
},
"BACKGROUND": {
"background": {
"description": "Background color of the contents.",
"aliases": [
"example": "black",
"Background",
"BACKGROUND"
],
"label": "Background color",
"description": "Background color of the contents. Use any color naming system recognized in CSS, e.g. HTLM names or HEX.",
"type": "line",
"default": "white"
"default": "white"
},
},
"TEXTCOLOR": {
"bstyle": {
"description": "Title text color",
"aliases": [
"example": "white",
"Bstyle",
"BSTYLE"
],
"label": "Box CSS Style",
"description": "Open CSS styling for the template main box, supersedes other template main box style options",
"type": "string"
},
"textcolor": {
"aliases": [
"Textcolor",
"TEXTCOLOR"
],
"label": "Title text color",
"description": "Title text color. Use any color naming system recognized in CSS, e.g. HTLM names or HEX.",
"type": "line",
"default": "black"
"default": "black"
},
},
"COLOR": {
"color": {
"description": "Background color of the title",
"aliases": [
"Color",
"COLOR"
],
"label": "Color",
"description": "Background color of the title. Use any color naming system recognized in CSS, e.g. HTLM names or HEX",
"example": "blue",
"example": "blue",
"type": "line",
"default": "#efefef"
"default": "#efefef"
},
},
"TITLE": {
"tstyle": {
"aliases": [
"Tstyle",
"TSTYLE"
],
"label": "Title CSS Style",
"description": "Open CSS styling for the title box, supersedes other title box style options",
"type": "string"
},
"title": {
"aliases": [
"Title",
"TITLE"
],
"label": "Title",
"description": "Title of the box",
"description": "Title of the box",
"type": "string",
"required": true
"required": true
},
},
"ALIGN": {
"align": {
"description": "Alignment of the text in contents",
"aliases": [
"example": "center"
"Align",
"ALIGN"
],
"label": "Text alignment",
"description": "Alignment of the text in contents, left, right, center, justify",
"type": "line",
"suggestedvalues": [
"left",
"right",
"center",
"justify"
],
"default": "left"
},
"cstyle": {
"aliases": [
"Cstyle",
"CSTYLE"
],
"label": "Content CSS Style",
"description": "Open CSS styling for the content box, supersedes other content box style options",
"type": "string"
}
}
},
},
"description": "Creates collapsible navigation box",
"paramOrder": [
"paramOrder": [
"1",
"1",
"TITLE",
"title",
"EXPANDED",
"width",
"WIDTH",
"color",
"BACKGROUND",
"background",
"TEXTCOLOR",
"textcolor",
"COLOR",
"align",
"ALIGN"
"expanded",
]
"bstyle",
"tstyle",
"cstyle"
],
"description": "Creates collapsible navigation box",
"format": "block"
}
}
</templatedata>
</templatedata>}}


<includeonly>[[Category:Navigation templates|*]]__NOTOC__</includeonly>
<includeonly>[[Category:Navigation templates|*]]__NOTOC__</includeonly>
<noinclude>[[Category:Documentation subpages]]</noinclude>
<noinclude>[[Category:Documentation subpages]]</noinclude>

Latest revision as of 11:45, 9 January 2024

This template creates a collapsible horizontal navigation box, i.e. a box containing links to articles related to the subject. Alternatively, the template can be used for any content, such as text or images. The template can be used as a basis of other templates or on its own on an article.

Note that the collapsibility does not work in mobile view. The box will still appear.

Usage

Minimal use:

{{Navbox|title=Title|Contents}}

The text within the template without parameter creates the contents of the navigation box.

Enter the parameter title for the title of the navigation box.

Other parameters are optional.

Full use:

{{Navbox
|expanded=
|width=
|textcolor=
|color=
|background=
|align=
|title=
|bstyle=
|tstyle=
|cstyle=
|Contents}}

Expanded determines if the navigation box is expanded or collapsed (open or closed) when the page is opened. Any text (such as "yes", "true", "1") causes the box to be initially opened. Leave empty if that is not desired.

Width determines the width of the navigation box. Enter the width in pixels (e.g. 150px), as percentage of the width of the article (e.g. 80%) or in other supported measures. Defaults to full width.

Textcolor determines the color of the title. Enter the color in HTML names (e.g. white) or in hex code (e.g. #FEF7FC). Defaults to the black.

Color determines the background color of the title. Enter the color in HTML names (e.g. black) or in hex code (e.g. #B57EDC). Defaults to #efefef, which is a shade of light grey.

Background determines the background color of the content. Enter the color in HTML names (e.g. black) or in hex code (e.g. #B57EDC). Defaults to white.

Align determines the alignment of the contents. Defaults to left.

Bstyle, tstyle and cstyle allow changes to the CSS styling of the template main box, title box and contents, respectively. These parameters can override all other styling to their respective objects. These are advanced parameters that can cause the template to work incorrectly if entered wrong.

Different capitalisations of the parameter names ("title", "Title", "TITLE") are accepted. Please only use one style per parameter name.

Examples

Basic navigation box

{{Navbox
|align=center
|title=Species of the [[Borderlands]]
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}
Species of the Borderlands

KlingonsSon'aSulibanDa'al • Thama • Nascaik • Demesians

More complex navigation box

{{Navbox
|expanded=yes
|width=400px
|align=center
|color=#996633
|textcolor=white
|title=Species of the [[Borderlands]]
|[[Klingon]]s • [[Son'a]] • [[Suliban]] • [[Da'al]] • Thama • Nascaik • Demesians}}
Species of the Borderlands

KlingonsSon'aSulibanDa'al • Thama • Nascaik • Demesians

Alternate use

{{Navbox
|color={{Color|Blue}}
|textcolor=white
|width=80%
|title=Shoreleave
|[[File:Classo.jpg|thumb|Rura Penthe is Class D, such as the moon above.]]
After the mission in the Muppetverse, the crew of the USS ''Diana'' went to a shore leave on Rura Pethe. Exhausted by the events of the previous mission, Jo Venan decided to use the opportunity for relaxation, as opposed to joining the other officers in exploring their holiday destination. As such, she remained mostly onboard the ship.

Later on the shoreleave, Jo visited Doctor Kila for her annual medical check. The Doctor was concerned of Jo's elevated heart rate, deciding to order her to go through some extra tests. Eventually, they found out Jo had an unusually large and warm heart, and no further operations were required.}}
Shoreleave
Rura Penthe is Class D, such as the moon above.

After the mission in the Muppetverse, the crew of the USS Diana went to a shore leave on Rura Pethe. Exhausted by the events of the previous mission, Jo Venan decided to use the opportunity for relaxation, as opposed to joining the other officers in exploring their holiday destination. As such, she remained mostly onboard the ship.

Later on the shoreleave, Jo visited Doctor Kila for her annual medical check. The Doctor was concerned of Jo's elevated heart rate, deciding to order her to go through some extra tests. Eventually, they found out Jo had an unusually large and warm heart, and no further operations were required.

Template data

Template Data

Creates collapsible navigation box

Template parameters

This template prefers block formatting of parameters.

ParameterDescriptionTypeStatus
Contents1

Contents shown in the box

Contentsuggested
Titletitle Title TITLE

Title of the box

Stringrequired
Widthwidth Width WIDTH

Width of the box. Use CSS measure units, e.g. pixels (px), em, %.

Example
500px
Lineoptional
Colorcolor Color COLOR

Background color of the title. Use any color naming system recognized in CSS, e.g. HTLM names or HEX

Default
#efefef
Example
blue
Lineoptional
Background colorbackground Background BACKGROUND

Background color of the contents. Use any color naming system recognized in CSS, e.g. HTLM names or HEX.

Default
white
Lineoptional
Title text colortextcolor Textcolor TEXTCOLOR

Title text color. Use any color naming system recognized in CSS, e.g. HTLM names or HEX.

Default
black
Lineoptional
Text alignmentalign Align ALIGN

Alignment of the text in contents, left, right, center, justify

Suggested values
left right center justify
Default
left
Lineoptional
Expandedexpanded Expanded EXPANDED

If not empty, the box will appear expanded (open) when the page is opened. Leave empty if you want the box to be closed when the page is opened.

Stringoptional
Box CSS Stylebstyle Bstyle BSTYLE

Open CSS styling for the template main box, supersedes other template main box style options

Stringoptional
Title CSS Styletstyle Tstyle TSTYLE

Open CSS styling for the title box, supersedes other title box style options

Stringoptional
Content CSS Stylecstyle Cstyle CSTYLE

Open CSS styling for the content box, supersedes other content box style options

Stringoptional