Pigsonthewing (talk | contribs) {{Unbulleted list| |
use syntaxhighlight |
||
(176 intermediate revisions by 69 users not shown) | |||
Line 1: | Line 1: | ||
{{ |
{{Documentation subpage}} |
||
{{about|the vertical navigation template|the horizontal template|Template:Navbox|the left sidebar of the interface|mw:Manual:Interface/Sidebar{{!}}the article in the Mediawiki Manual}} |
|||
{{#ifeq:{{FULLPAGENAME}}|Template:Sidebar|{{High-risk| approximately 145000 }}{{Template display|nomobile}}}} |
|||
{{Lua|Module:Sidebar}} |
|||
This template is |
This template is a [[wikt:metatemplate|metatemplate]] for the creation of sidebar templates, i.e. boxes that are [[Vertical direction|vertically]] aligned [[Wikipedia:Navigation template|navigation templates]]. Sidebars, like [[Wikipedia:Manual of Style/Infoboxes|infoboxes]], are usually positioned on the right-hand side of a page. |
||
{{tl|Sidebar with collapsible lists}} is a version of {{tl|Sidebar}} that adds collapsibility to its sections, i.e. the means to show or hide sections by clicking links beside their headings. |
|||
Use {{tl|Unbulleted list}} rather than <code><br /></code> to separate unbulleted lists of items or links. See, for example, {{Tl|Bertrand Russell}}. |
|||
{{Navbox visibility}} |
|||
{{tl|Sidebar with collapsible lists}} adds collapsibility to a Sidebar's sections, i.e. the means to show or hide sections by clicking links beside their headings. |
|||
Note that [[MOS:LEAD]] discourages the placement of sidebars in the lead section of articles. |
|||
== Usage == |
== Usage == |
||
{{Parameter names example |name= |outertitle |topimage |pretitle |title |image |caption |above |heading1 |content1 |heading2 |content2 |heading3 |content3 |content4=''…… etc ……'' |below}} |
|||
<syntaxhighlight lang="wikitext"> |
|||
Parameters with infrequent use omitted. |
|||
{{Sidebar |
|||
<pre overflow: auto"> |
|||
| name = {{subst:PAGENAME}} |
|||
{{ sidebar |
|||
| |
| class = |
||
| wraplinks = <!-- "true" otherwise (default:) omit --> |
|||
| outertitle = |
|||
| |
| float = |
||
| |
| templatestyles = |
||
| child templatestyles = |
|||
| title = |
|||
| grandchild templatestyles = |
|||
| image = |
|||
| headingstyle = |
|||
| contentstyle = |
|||
| |
| outertitleclass = |
||
| |
| outertitle = |
||
| |
| topimageclass = |
||
| |
| topimage = |
||
| topcaption = |
|||
| |
| pretitleclass = |
||
| |
| pretitle = |
||
| titleclass = |
|||
... |
|||
| title = |
|||
| |
| imageclass = |
||
| |
| image = |
||
| caption = |
|||
| headingclass = |
|||
| contentclass = |
|||
| aboveclass = |
|||
| above = |
|||
| heading1 = |
|||
| heading1class = |
|||
| content1 = |
|||
| content1class = |
|||
| heading2 = |
|||
| heading2class = |
|||
| content2 = |
|||
| content2class = |
|||
| heading3 = |
|||
| heading3class = |
|||
| content3 = |
|||
| content3class = |
|||
<!-- (omitting infinite heading/content parameters) --> |
|||
| belowclass = |
|||
| below = |
|||
| navbar = |
|||
}} |
}} |
||
</syntaxhighlight> |
|||
</pre> |
|||
Note that {{section link|Wikipedia:Manual of Style/Lead section#Elements}} discourages the placement of sidebars in the lead section of articles, though they may be included on a case-by-case basis. |
|||
== Parameters == |
|||
== Parameters == |
|||
No parameters are required unless {{tl|navbar}} links ("v'''·'''d'''·'''e") are to appear at the bottom of the sidebar, in which case the parameter ''name'' is needed (see entry in the table immediately below). |
|||
{{anchor|Other parameters}} |
|||
No parameters are mandatory. If {{tl|navbar}} links are to function correctly (unless their appearance is suppressed; see the ''navbar'' parameter [[#Other parameters|below]]), the parameter ''name'' needs to be set (to [[Wikipedia:Page name|the name of]] the sidebar's page). (This does not apply if the [[Lua (programming language)|Lua module]] that produces {{tlf|Sidebar}}, [[Module:Sidebar]], is being used directly.) |
|||
{| class="wikitable" |
|||
===Principal=== |
|||
|- |
|||
{| class="wikitable" style="line-height:1.4em;" |
|||
! |
! scope="col" | Parameter |
||
! scope="col" | Explanation |
|||
|- style="vertical-align:top;" |
|||
|- |
|||
| ''name'' |
|||
| {{para|above}} |
|||
| The sidebar's name, i.e. the name following "Template:" in the page's name. Required for the {{tl|navbar}} links at the bottom of the sidebar to function correctly, unless these are omitted (see ''navbar'' at the bottom of this table). It is recommended to use ''<nowiki>{{subst:PAGENAME}}</nowiki>'' for this field. |
|||
| Same as the {{para|above}} offered by {{tl|Navbox}}. |
|||
|- style="vertical-align:top;" |
|||
|- |
|||
| ''outertitle'' |
|||
| {{para|name}} |
|||
| The sidebar's name, i.e. the name following "Template:" in the title shown at the top of the sidebar's page. <br />Required if the {{small|{{smallcaps|V T E}}}} {{tl|navbar}} links at the bottom of the sidebar are to function correctly, unless their appearance is suppressed (see the ''navbar'' parameter [[#Other parameters|below]]) or {{tlf|Sidebar}} is not being used as a [[Wrapper function|wrapper]] for [[Module:Sidebar]]. When {{tlf|Sidebar}} is used as a wrapper, setting {{para|name|<nowiki>{{subst:PAGENAME}}</nowiki>}} is recommended. |
|||
|- |
|||
| {{para|float}} |
|||
| Accepts the values <code>none</code> and <code>left</code>. The former aligns the box left without floating and the latter with floating behavior. The default float is right and does not need specifying. Prefer this parameter (and passing it to any using templates such as with {{tl|Helpbox}}) to specifying your own floats in TemplateStyles. |
|||
|- |
|||
| {{para|outertitle}} |
|||
| Use to place a title for the sidebar immediately above the sidebar. |
| Use to place a title for the sidebar immediately above the sidebar. |
||
|- style="vertical-align:top;" |
|||
| ''topimage'' |
|||
| Use to place an image at the top of the sidebar, i.e. above any ''title'' included.<br/>Full wikisyntax expected (i.e. <code><nowiki>[[Image:...]]</nowiki></code>).<br/>To add a caption below the image, use ''topimagecaption''. |
|||
|- style="vertical-align:top;" |
|||
| ''pretitle'' |
|||
| Use to place a line such as "Part of the ''X'' series on" before the title. |
|||
|- style="vertical-align:top;" |
|||
| ''title'' |
|||
| Use to place a title for the sidebar at the top of the sidebar (immediately below the ''topimage'', if used). |
|||
|- style="vertical-align:top;" |
|||
| ''image'' |
|||
| Use to place an image between the ''title'' (if used) and first section.<br/>As with ''topimage'', full wikisyntax expected (i.e. <code><nowiki>[[Image:...]]</nowiki></code>).<br/>To add a caption below the image, use ''imagecaption''. |
|||
|- style="vertical-align:top;" |
|||
| ''headingstyle'' |
|||
| Use to alter the default CSS styling set for section headings.<br/>To alter the CSS styling for a specific section's heading, use ''headingNstyle'', where ''N'' is the number of the section. |
|||
|- style="vertical-align:top;" |
|||
| ''contentstyle'' |
|||
| Use to alter the default CSS styling set for section content.<br/>To alter the CSS styling for a particular section's content, use ''contentNstyle'', where ''N'' is the number of the section. |
|||
|- style="vertical-align:top;" |
|||
| ''heading1'' || First section's heading (if needed).</tr> |
|||
| '''''content1''''' || First section's content (required).</tr> |
|||
|- style="vertical-align:top;" |
|||
| ''heading2'' || Second section's heading (if needed).</tr> |
|||
| ''content2'' || Second section's content (if needed).</tr> |
|||
|- style="vertical-align:top;" |
|||
| ''heading3'' || Third section's heading (if needed).</tr> |
|||
| ''content3'' || Third section's content (if needed).</tr> |
|||
|- |
|- |
||
| {{para|topimage}} |
|||
|colspan="2"| ...... etc ...... |
|||
|style="padding-left:0.5em;"| Use to place an image at the top of the sidebar, i.e. above {{para|title}} (if used). Full wiki syntax is expected (i.e. <code><nowiki>[[File:...]]</nowiki></code>). <br />To add a caption below the image, use {{para|topcaption}}. <br />Per [[WP:SIDEBAR]] this field should only be used to define a generic image for a sidebar, not to provide custom images for individual articles: sidebars are not displayed on mobile. |
|||
|- |
|- |
||
| {{para|pretitle}} |
|||
| ''heading35'' ||rowspan="2"| Currently, the last possible section heading and/or content (if needed).</tr> |
|||
|style="padding-left:0.5em;"| Use to place a line such as "Part of the ''X'' series on" before the title. |
|||
| ''content35'' |
|||
|- |
|||
|- style="vertical-align:top;" |
|||
| {{para|title}} |
|||
| ''navbar'' |
|||
|style="padding-left:0.5em;"| Use to place a title for the sidebar at the top of the sidebar. (If {{para|topimage}} is used, it will appear immediately below it). |
|||
| Set to "none" (without the quotes) to remove the {{tl|navbar}} links appearing at the bottom of the sidebar. |
|||
| |
|- |
||
| {{para|image}} |
|||
|style="padding-left:0.5em;"| Use to place an image between the {{para|title}} (if used) and first section. As with {{para|topimage}}, full wiki syntax is expected (i.e. <code><nowiki>[[File:...]]</nowiki></code>). <br />To add a caption below the image, use {{para|caption}}. |
|||
|- |
|||
| {{para|heading<sub>n</sub>}}<br/>{{para|content<sub>n</sub>}} |
|||
|style="padding-left:0.5em;"| The ''n''th heading{{\}}content. ''content<sub>n</sub>'' is required if ''heading<sub>n</sub>'' is also to appear. |
|||
|- |
|||
| {{para|templatestyles}} |
|||
|style="padding-left:0.5em;"| See [[#TemplateStyles]]. |
|||
|- |
|||
| id="Classes" | |
|||
*{{nowrap|{{para|class}} or {{para|bodyclass}}}} |
|||
*{{para|outertitleclass}} |
|||
*{{para|topimageclass}} |
|||
*{{para|pretitleclass}} |
|||
*{{para|titleclass}} |
|||
*{{para|imageclass}} |
|||
*{{para|aboveclass}} |
|||
*{{para|headingclass}} |
|||
*{{para|contentclass}} |
|||
*{{para|heading<sub>n</sub>class}} |
|||
*{{para|content<sub>n</sub>class}} |
|||
*{{para|belowclass}} |
|||
|style="padding-left:0.5em;"| |
|||
Classes can be used to make styles easier to target for [[#TemplateStyles|TemplateStyles]]. {{para|class}} must be used for this purpose for an entire sidebar (otherwise a page with multiple sidebars may take styles intended only for one sidebar). An example for a template named "Template:Example Sidebar" might have the class {{para|class|example-sidebar}}. |
|||
{{para|heading<sub>n</sub>class}} and {{para|content<sub>n</sub>class}} can be used to target a specific heading or content group. This should be needed only rarely. |
|||
These classes can also be used for [[WP:microformats|microformats]]. |
|||
Dot before a class-name can be omitted: {{para|class|foo}}. |
|||
===Other parameters=== |
|||
{| class="wikitable" style="line-height:1.4em;" |
|||
!style="width:10.0em;"| Parameter !! Explanation |
|||
|- style="vertical-align:top;" |
|||
| ''above'' |
|||
| Corresponds to ''above'' parameter offered by {{tl|Navbox}}. |
|||
|- |
|- |
||
| {{para|below}} |
|||
| |
|||
|style="padding-left:0.5em;"| Same as the {{para|below}} offered by {{tl|Navbox}}.<br />(Use, for example, to add one or more portal links to the bottom of the template (shown, by default, in bold).) |
|||
''class'' (or ''bodyclass'')<br/> |
|||
''outertitleclass''<br/> |
|||
''topimageclass''<br/> |
|||
''titleclass''<br/> |
|||
''imageclass''<br/> |
|||
| |
|||
[[Wikipedia:WikiProject Microformats#What are microformats?|Microformat]] classes for the corresponding parameters.<br/>(''class''{{\}}''bodyclass'' applies to the sidebar as a whole.) |
|||
|- style="vertical-align:top;" |
|||
| ''below'' |
|||
| Use to e.g. add one or more portal links to the bottom of the template (by default in bold). |
|||
|- |
|- |
||
| {{para|navbar}} |
|||
| |
|||
|style="padding-left:0.5em;"| When {{para|name}} is specified, {{tl|navbar}} is shown at the bottom of the sidebar. Setting {{para|navbar|off}} or {{para|navbar|none}} will suppress the {{navbar|Sidebar/doc|mini=1}} links showing. |
|||
''style'' (or ''bodystyle'')<br/> |
|||
''outertitlestyle''<br/> |
|||
''topimagestyle''<br/> |
|||
''topcaptionstyle''<br/> |
|||
''pretitlestyle''<br/> |
|||
''titlestyle''<br/> |
|||
''imagestyle''<br/> |
|||
''captionstyle''<br/> |
|||
''belowstyle''<br/> |
|||
''navbarstyle''<br/> |
|||
| |
|||
Use to alter default CSS styling for the corresponding parameters.<br/> (''style''{{\}}''bodystyle'' applies to the sidebar as a whole.) |
|||
|- style="vertical-align:top;" |
|||
| ''cellspacing '' |
|||
| Use to amend the default cellspacing set for the infobox-class table with which the sidebar is built. |
|||
|- style="vertical-align:top;" |
|||
| ''cellpadding'' |
|||
| Ditto the default cellpadding. |
|||
|- style="vertical-align:top;" |
|||
| ''navbaroptions'' |
|||
| Use to specify more options for the navbar at the bottom of the sidebar (see {{tl|navbar}} for options available). |
|||
|} |
|} |
||
== |
=== TemplateStyles === |
||
{{further|Wikipedia:TemplateStyles}} |
|||
The TemplateStyles parameters {{para|templatestyles}}, {{para|child templatestyles}}, and {{para|grandchild templatestyles}} take the pagename of a [[WP:TemplateStyles|TemplateStyles]] page and turn it into a TemplateStyles tag. The TemplateStyles tag is a much more powerful way to add styling to a sidebar. |
|||
{{tl|normalwraplink}} may be used to handle links that should wrap within the sidebar or otherwise need to be made to wrap in order to prevent the sidebar becoming too wide. Use <code style="white-space:nowrap;"><nowiki>{{normalwraplink|</nowiki>''longlinkname''}}</code>, where ''longlinkname'' is the long link without its square brackets. |
|||
Some rules of use: |
|||
Use the <code>wraplinks</code> parameter to turn link wrapping off for the whole template. |
|||
# Always add a template-specific class in {{para|class}} so that the styles added to one sidebar will not "leak" into another sidebar. For example, [[Template:DYK tools]] has {{para|class|dyk-tools}} and the [[Template:DYK tools/styles.css]] page targets <code>.dyk-tools</code> for all of its added styling. |
|||
# Do not assume Template:Sidebar will continue to have a table structure (i.e., do not target <code>table</code> or any other table HTML in the TemplateStyles page). The table structure is soft-deprecated and will go away at some point in the future. |
|||
These tags are loaded in this order: Core templatestyles ([[Module:Sidebar/styles.css]]), templatestyles, child, and then grandchild, which can be used to 'cascade' the styles. |
|||
== Full blank syntax == |
|||
(omitting sections 4 to penultimate) |
|||
; {{para|templatestyles}} |
|||
<pre style="overflow:auto;"> |
|||
: This parameter is intended for a template or module calling {{tl|sidebar}} directly. |
|||
{{Sidebar |
|||
; {{para|child templatestyles}} |
|||
|name = {{subst:PAGENAME}} |
|||
: This parameter is intended for a template or module which calls a sidebar with {{para|templatestyles}}. |
|||
|class = <!--or bodyclass--> |
|||
; {{para|grandchild templatestyles}} |
|||
|style = <!--or bodystyle--> |
|||
: This parameter is intended for a template or module which calls a sidebar with {{para|child templatestyles}}. |
|||
|cellspacing = |
|||
|cellpadding = |
|||
|sectdivider = |
|||
The canonical list of classes output with each kind of element of a sidebar (i.e. output for all {{para|content<sub>n</sub>}}, or all cases of {{para|above}}) can be found in [[Module:Sidebar/configuration]] in the "class" table. The below is a non-authoritative but otherwise sufficient list for most generic styling: |
|||
|outertitle = |
|||
{{div col}} |
|||
|outertitleclass = |
|||
; <code>.sidebar</code> |
|||
|outertitlestyle = |
|||
: The top-level sidebar class. |
|||
; <code>.sidebar-outer-title</code> |
|||
: The class associated with a {{para|outertitle}}. |
|||
; <code>.sidebar-top-image</code> |
|||
: The class associated with a {{para|topimage}}. |
|||
; <code>.sidebar-top-caption</code> |
|||
: The class associated with a {{para|topcaption}}. |
|||
; <code>.sidebar-pretitle</code> |
|||
; <code>.sidebar-pretitle-with-top-image</code> |
|||
: The classes associated with a {{para|pretitle}}. Only one of these will be output per sidebar, depending on whether {{para|topimage}} is present. |
|||
; <code>.sidebar-title</code> |
|||
; <code>.sidebar-title-with-pretitle</code> |
|||
: The classes associated with a {{para|title}}. Only one of these will be output per sidebar, depending on whether {{para|pretitle}} is present. |
|||
; <code>.sidebar-image</code> |
|||
: The class associated with a {{para|image}}. |
|||
; <code>.sidebar-caption</code> |
|||
: The class associated with a {{para|caption}}. |
|||
; <code>.sidebar-above</code> |
|||
: The class associated with a {{para|above}}. |
|||
; <code>.sidebar-heading</code> |
|||
: The class associated with a {{para|heading<sub>n</sub>}}. Every heading will have this class. |
|||
; <code>.sidebar-content</code> |
|||
; <code>.sidebar-content-with-subgroup</code> |
|||
: The classes associated with {{para|content<sub>n</sub>}}. Every content group will have one of these classes, depending on whether the specific content has a subgroup. |
|||
; <code>.sidebar-below</code> |
|||
: The class associated with a {{para|below}}. |
|||
; <code>.sidebar-navbar</code> |
|||
: The class associated with a {{para|navbar}}. |
|||
{{div col end}} |
|||
==== Example TemplateStyles parameter use ==== |
|||
|topimage = |
|||
|topimageclass = |
|||
|topimagestyle = |
|||
|topcaption = |
|||
|topcaptionstyle = |
|||
For an example of a sidebar which does not need to support children templates of its own (whether because it has no children or because it wants no children): |
|||
|pretitle = |
|||
|pretitlestyle = |
|||
<syntaxhighlight lang="wikitext"> |
|||
|title = |
|||
{{Sidebar |
|||
|titleclass = |
|||
| title = Child Example |
|||
|titlestyle = |
|||
| class = sidebar-example |
|||
| templatestyles = Template:Sidebar/example/styles.css |
|||
}} |
|||
</syntaxhighlight> |
|||
For an example of a sidebar which does have its own children and an example of one of the children (grandchild templates have a similar use): |
|||
|image = |
|||
|imageclass = |
|||
|imagestyle = |
|||
|caption = |
|||
|captionstyle = |
|||
<div style="display: flex"> |
|||
|abovestyle = |
|||
<syntaxhighlight lang="wikitext"> |
|||
|above = |
|||
{{Sidebar |
|||
| title = {{{title|Title Child Example}}} |
|||
| class = sidebar-example {{{class|}}} |
|||
| templatestyles = Template:Sidebar/example/styles.css |
|||
| child templatestyles = {{{child templatestyles|}}} |
|||
}} |
|||
</syntaxhighlight> |
|||
<syntaxhighlight lang="wikitext"> |
|||
{{Sidebar/child example |
|||
| title = Title Grandchild Example |
|||
| class = sidebar-child-example |
|||
| child templatestyles = Template:Sidebar/child example/styles.css |
|||
}} |
|||
</syntaxhighlight> |
|||
</div> |
|||
== Handling long links == |
|||
|headingstyle = |
|||
|contentstyle = |
|||
{{tl|Normalwraplink}} may be used to handle individual links that should wrap within the sidebar or otherwise need to be made to wrap, in order to prevent the sidebar from becoming too wide. Use {{tlx|normalwraplink|{{var|longlinkname}}}}, where {{para||{{var|longlinkname}}}} is the long link without its square brackets. |
|||
|heading1style = |
|||
|heading1 = |
|||
|content1style = |
|||
|content1 = |
|||
Use the {{para|wraplinks|true}} parameter to enable link wrapping (disabling {{codett|lang=css|nowraplinks}} CSS class) for the whole template. |
|||
|heading2style = |
|||
|heading2 = |
|||
|content2style = |
|||
|content2 = |
|||
== Nesting == |
|||
|heading3style = |
|||
|heading3 = |
|||
|content3style = |
|||
|content3 = |
|||
One sidebar template can be nested (embedded) into another one by using the {{para|child}} parameter. This feature can be used to create a modular sidebar, or to create more well-defined and logical sections. |
|||
<!--etc.--> |
|||
{{Sidebar |
|||
|heading35style = |
|||
| title = Top-level title |
|||
|heading35 = |
|||
| content1 = |
|||
|content35style = |
|||
{{Sidebar |child=yes |
|||
|content35 = |
|||
| title = First subsection |
|||
| heading1 = Heading 1.1 |
|||
| content1 = Content 1.1 |
|||
}} |
|||
| content2 = |
|||
{{Sidebar |child=yes |
|||
| title = Second subsection |
|||
| heading1 = Heading 2.1 |
|||
| content1 = Content 2.1 |
|||
}} |
|||
| below = "below" text |
|||
}} |
|||
<div style="position:relative;bottom:0.5em; overflow:auto;"> |
|||
<syntaxhighlight lang="wikitext"> |
|||
{{Sidebar |
|||
| title = Top-level title |
|||
| content1 = |
|||
{{Sidebar |child=yes |
|||
| title = First subsection |
|||
| heading1 = Heading 1.1 |
|||
| content1 = Content 1.1 |
|||
}} |
|||
| content2 = |
|||
{{Sidebar |child=yes |
|||
| title = Second subsection |
|||
| heading1 = Heading 2.1 |
|||
| content1 = Content 2.1 |
|||
}} |
|||
| below = "below" text |
|||
}} |
|||
</syntaxhighlight> |
|||
</div> |
|||
Note in the examples above that the child sidebar is placed in a {{code|content}} field, not a {{code|heading}} field. Notice also that the section subheadings do not appear in bold if this is not explicitly specified. To obtain bold section headings, move the titles to the {{code|heading}} field, using |
|||
|belowstyle = |
|||
|below = |
|||
{{Sidebar |
|||
|navbar = |
|||
| title = Top-level title |
|||
|navbarstyle = |
|||
| heading1 = First subsection |
|||
|navbaroptions = |
|||
| content1 = |
|||
{{Sidebar |child=yes |
|||
|wraplinks = true/false |
|||
| heading1 = Heading 1.1 |
|||
| content1 = Content 1.1 |
|||
}} |
|||
| heading2 = Second subsection |
|||
| content2 = |
|||
{{Sidebar |child=yes |
|||
| heading1 = Heading 2.1 |
|||
| content1 = Content 2.1 |
|||
}} |
|||
| below = "below" text |
|||
}} |
}} |
||
<div style="position:relative;bottom:0.5em; overflow:auto;"> |
|||
</pre> |
|||
<syntaxhighlight lang="wikitext"> |
|||
{{Sidebar |
|||
| title = Top-level title |
|||
| heading1 = First subsection |
|||
| content1 = |
|||
{{Sidebar |child=yes |
|||
| heading1 = Heading 1.1 |
|||
| content1 = Content 1.1 |
|||
}} |
|||
| heading2 = Second subsection |
|||
| content2 = |
|||
{{Sidebar |child=yes |
|||
| heading1 = Heading 2.1 |
|||
| content1 = Content 2.1 |
|||
}} |
|||
| below = "below" text |
|||
}} |
|||
</syntaxhighlight> |
|||
</div> |
|||
== |
== Deprecated parameters == |
||
The following parameters are deprecated in favor of [[#TemplateStyles|TemplateStyles]] and templates/modules using them are categorized into [[:Category:Sidebars with styles needing conversion]]. The category page has further conversion information. |
|||
A specific real conversion example is [[Template:DYK tools]] where the [[Special:Diff/1002727584|styles were moved]] to [[Template:DYK tools/styles.css]]. |
|||
{| class="wikitable" |
|||
|- |
|||
! scope="col" | Parameter |
|||
! scope="col" | Explanation |
|||
! scope="col" | TemplateStyles replacement class |
|||
|- |
|||
| {{nowrap|{{para|style}} or {{para|bodystyle}}}} |
|||
| Additional [[Help:Cascading Style Sheets|CSS]] for the whole sidebar. |
|||
| Class assigned to the template in {{para|class}} |
|||
|- |
|||
| {{para|basestyle}} |
|||
| Additional CSS for a grabbag of parameters: {{para|pretitle}}, {{para|title}}, {{para|heading<sub>n</sub>}}, and {{para|listtitle<sub>n</sub>}} (for {{tl|sidebar with collapsible lists}}). |
|||
| See related parameters for targeting pretitle, title, all headings, and all lists. Applies {{em|before}} the specific style parameter so must be placed above that parameter's declarations if any in the TemplateStyles sheet. |
|||
|- |
|||
|{{para|outertitlestyle}} |
|||
|Additional CSS for {{Para|outertitle}}. |
|||
| {{code|lang=css|.sidebar-outer-title}} |
|||
|- |
|||
|{{para|topimagestyle}} |
|||
|Additional CSS for {{Para|topimage}}. |
|||
| {{code|lang=css|.sidebar-top-image}} |
|||
|- |
|||
|{{para|topcaptionstyle}} |
|||
|Additional CSS for {{Para|topcaption}}. |
|||
| {{code|lang=css|.sidebar-topcaption}} |
|||
|- |
|||
|{{para|pretitlestyle}} |
|||
|Additional CSS for {{Para|pretitle}}. |
|||
| {{code|lang=css|.sidebar-pretitle}} or {{code|lang=css|.sidebar-pretitle-with-top-image}} |
|||
|- |
|||
|{{para|titlestyle}} |
|||
|Additional CSS for {{Para|title}}. |
|||
| {{code|lang=css|.sidebar-title}} or {{code|lang=css|.sidebar-title-with-pretitle}} |
|||
|- |
|||
|{{para|imagestyle}} |
|||
|Additional CSS for {{Para|image}}. |
|||
| {{code|lang=css|.sidebar-image}} |
|||
|- |
|||
|{{para|captionstyle}} |
|||
|Additional CSS for {{Para|caption}}. |
|||
| {{code|lang=css|.sidebar-caption}} |
|||
|- |
|||
|{{para|abovestyle}} |
|||
|Additional CSS for {{Para|above}}. |
|||
| {{code|lang=css|.sidebar-above}} |
|||
|- |
|||
| {{para|headingstyle}} |
|||
| Additional CSS for section headings. |
|||
| {{code|lang=css|.sidebar-heading}} |
|||
|- |
|||
| {{para|heading<sub>n</sub>style}} |
|||
| Additional CSS for {{Para|heading<sub>n</sub>}}. |
|||
| Class assigned to the heading in {{para|heading<sub>n</sub>class}} |
|||
|- |
|||
| {{para|contentstyle}} |
|||
| Additional CSS for all section content. |
|||
| {{code|lang=css|.sidebar-content}} and/or {{code|lang=css|.sidebar-content-with-subgroup}} |
|||
|- |
|||
| {{para|content<sub>n</sub>style}} |
|||
| Additional CSS for {{Para|content<sub>n</sub>}}. |
|||
| Class assigned to the content in {{para|content<sub>n</sub>class}} |
|||
|- |
|||
| {{para|belowstyle}} |
|||
| Additional CSS for {{Para|below}}. |
|||
| {{code|lang=css|.sidebar-below}} |
|||
|- |
|||
| {{para|navbarstyle}} |
|||
| Additional CSS for the generated navbar. |
|||
| {{code|lang=css|.sidebar-navbar}} |
|||
|- |
|||
| {{para|navbarfontstyle}} |
|||
| Additional CSS passed to the navbar module to target the VTE (colors usually). |
|||
| {{code|lang=css|.sidebar-navbar li, .sidebar-navbar a}} |
|||
|} |
|||
== Tracking category == |
|||
* {{clc|Pages using sidebar with the child parameter}} |
|||
* {{clc|Sidebars with styles needing conversion}} |
|||
== See also == |
|||
* [[Special:Permalink/609911857|Last pre-Lua version]] |
|||
* {{tl|Sidebar with collapsible lists}} |
* {{tl|Sidebar with collapsible lists}} |
||
* {{tl|Infobox}} |
* {{tl|Infobox}} |
||
* {{tl|Side box}} |
|||
* [[Wikipedia:UBLIST]], for help using unbulleted lists within content. |
|||
<includeonly> |
<includeonly>{{Sandbox other|| |
||
[[Category: |
[[Category:Sidebar meta-templates| ]] |
||
[[Category: |
[[Category:Templates that add a tracking category]] |
||
}}</includeonly> |
|||
[[ar:قالب:Sidebar]] |
|||
[[bg:Шаблон:Страничен панел]] |
|||
[[ca:Plantilla:Barra lateral]] |
|||
[[id:Templat:Sidebar]] |
|||
[[ja:Template:Sidebar]] |
|||
[[pt:Predefinição:Sidebar]] |
|||
[[ru:Шаблон:Боковая навигационная таблица]] |
|||
[[sk:Šablóna:Bočný panel]] |
|||
[[fi:Malline:Sivupalkki]] |
|||
[[th:แม่แบบ:Sidebar]] |
|||
[[uk:Шаблон:Бічна навігація]] |
|||
[[ur:Template:Sidebar]] |
|||
</includeonly> |
Revision as of 20:58, 27 February 2024
This template is a metatemplate for the creation of sidebar templates, i.e. boxes that are vertically aligned navigation templates. Sidebars, like infoboxes, are usually positioned on the right-hand side of a page.
{{Sidebar with collapsible lists}} is a version of {{Sidebar}} that adds collapsibility to its sections, i.e. the means to show or hide sections by clicking links beside their headings.
Templates using the classes class=navbox
({{navbox}}) or class=nomobile
({{sidebar}}) are not displayed on the mobile web site of English Wikipedia. Mobile page views account for approximately 66% of all page views (90-day average as of January 2024[update]).
Note that MOS:LEAD discourages the placement of sidebars in the lead section of articles.
Usage
{{{topimage}}} |
{{{pretitle}}} |
{{{title}}} |
---|
{{{image}}} |
{{{above}}} |
{{{heading1}}} |
{{{content1}}} |
{{{heading2}}} |
{{{content2}}} |
{{{heading3}}} |
{{{content3}}} |
…… etc …… |
{{{below}}} |
{{Sidebar
| name = {{subst:PAGENAME}}
| class =
| wraplinks = <!-- "true" otherwise (default:) omit -->
| float =
| templatestyles =
| child templatestyles =
| grandchild templatestyles =
| outertitleclass =
| outertitle =
| topimageclass =
| topimage =
| topcaption =
| pretitleclass =
| pretitle =
| titleclass =
| title =
| imageclass =
| image =
| caption =
| headingclass =
| contentclass =
| aboveclass =
| above =
| heading1 =
| heading1class =
| content1 =
| content1class =
| heading2 =
| heading2class =
| content2 =
| content2class =
| heading3 =
| heading3class =
| content3 =
| content3class =
<!-- (omitting infinite heading/content parameters) -->
| belowclass =
| below =
| navbar =
}}
Note that Wikipedia:Manual of Style/Lead section § Elements discourages the placement of sidebars in the lead section of articles, though they may be included on a case-by-case basis.
Parameters
No parameters are mandatory. If {{navbar}} links are to function correctly (unless their appearance is suppressed; see the navbar parameter below), the parameter name needs to be set (to the name of the sidebar's page). (This does not apply if the Lua module that produces {{Sidebar}}, Module:Sidebar, is being used directly.)
Parameter | Explanation |
---|---|
|above=
|
Same as the |above= offered by {{Navbox}}.
|
|name=
|
The sidebar's name, i.e. the name following "Template:" in the title shown at the top of the sidebar's page. Required if the V T E {{navbar}} links at the bottom of the sidebar are to function correctly, unless their appearance is suppressed (see the navbar parameter below) or {{Sidebar}} is not being used as a wrapper for Module:Sidebar. When {{Sidebar}} is used as a wrapper, setting |name={{subst:PAGENAME}} is recommended.
|
|float=
|
Accepts the values none and left . The former aligns the box left without floating and the latter with floating behavior. The default float is right and does not need specifying. Prefer this parameter (and passing it to any using templates such as with {{Helpbox}}) to specifying your own floats in TemplateStyles.
|
|outertitle=
|
Use to place a title for the sidebar immediately above the sidebar. |
|topimage=
|
Use to place an image at the top of the sidebar, i.e. above |title= (if used). Full wiki syntax is expected (i.e. [[File:...]] ). To add a caption below the image, use |topcaption= . Per WP:SIDEBAR this field should only be used to define a generic image for a sidebar, not to provide custom images for individual articles: sidebars are not displayed on mobile. |
|pretitle=
|
Use to place a line such as "Part of the X series on" before the title. |
|title=
|
Use to place a title for the sidebar at the top of the sidebar. (If |topimage= is used, it will appear immediately below it).
|
|image=
|
Use to place an image between the |title= (if used) and first section. As with |topimage= , full wiki syntax is expected (i.e. [[File:...]] ). To add a caption below the image, use |caption= .
|
|headingn= |contentn=
|
The nth heading / content. contentn is required if headingn is also to appear. |
|templatestyles=
|
See #TemplateStyles. |
|
Classes can be used to make styles easier to target for TemplateStyles.
These classes can also be used for microformats. Dot before a class-name can be omitted: |
|below=
|
Same as the |below= offered by {{Navbox}}.(Use, for example, to add one or more portal links to the bottom of the template (shown, by default, in bold).) |
|navbar=
|
When |name= is specified, {{navbar}} is shown at the bottom of the sidebar. Setting |navbar=off or |navbar=none will suppress the links showing.
|
TemplateStyles
The TemplateStyles parameters |templatestyles=
, |child templatestyles=
, and |grandchild templatestyles=
take the pagename of a TemplateStyles page and turn it into a TemplateStyles tag. The TemplateStyles tag is a much more powerful way to add styling to a sidebar.
Some rules of use:
- Always add a template-specific class in
|class=
so that the styles added to one sidebar will not "leak" into another sidebar. For example, Template:DYK tools has|class=dyk-tools
and the Template:DYK tools/styles.css page targets.dyk-tools
for all of its added styling. - Do not assume Template:Sidebar will continue to have a table structure (i.e., do not target
table
or any other table HTML in the TemplateStyles page). The table structure is soft-deprecated and will go away at some point in the future.
These tags are loaded in this order: Core templatestyles (Module:Sidebar/styles.css), templatestyles, child, and then grandchild, which can be used to 'cascade' the styles.
|templatestyles=
- This parameter is intended for a template or module calling {{sidebar}} directly.
|child templatestyles=
- This parameter is intended for a template or module which calls a sidebar with
|templatestyles=
. |grandchild templatestyles=
- This parameter is intended for a template or module which calls a sidebar with
|child templatestyles=
.
The canonical list of classes output with each kind of element of a sidebar (i.e. output for all |contentn=
, or all cases of |above=
) can be found in Module:Sidebar/configuration in the "class" table. The below is a non-authoritative but otherwise sufficient list for most generic styling:
.sidebar
- The top-level sidebar class.
.sidebar-outer-title
- The class associated with a
|outertitle=
. .sidebar-top-image
- The class associated with a
|topimage=
. .sidebar-top-caption
- The class associated with a
|topcaption=
. .sidebar-pretitle
.sidebar-pretitle-with-top-image
- The classes associated with a
|pretitle=
. Only one of these will be output per sidebar, depending on whether|topimage=
is present. .sidebar-title
.sidebar-title-with-pretitle
- The classes associated with a
|title=
. Only one of these will be output per sidebar, depending on whether|pretitle=
is present. .sidebar-image
- The class associated with a
|image=
. .sidebar-caption
- The class associated with a
|caption=
. .sidebar-above
- The class associated with a
|above=
. .sidebar-heading
- The class associated with a
|headingn=
. Every heading will have this class. .sidebar-content
.sidebar-content-with-subgroup
- The classes associated with
|contentn=
. Every content group will have one of these classes, depending on whether the specific content has a subgroup. .sidebar-below
- The class associated with a
|below=
. .sidebar-navbar
- The class associated with a
|navbar=
.
Example TemplateStyles parameter use
For an example of a sidebar which does not need to support children templates of its own (whether because it has no children or because it wants no children):
{{Sidebar
| title = Child Example
| class = sidebar-example
| templatestyles = Template:Sidebar/example/styles.css
}}
For an example of a sidebar which does have its own children and an example of one of the children (grandchild templates have a similar use):
{{Sidebar
| title = {{{title|Title Child Example}}}
| class = sidebar-example {{{class|}}}
| templatestyles = Template:Sidebar/example/styles.css
| child templatestyles = {{{child templatestyles|}}}
}}
{{Sidebar/child example
| title = Title Grandchild Example
| class = sidebar-child-example
| child templatestyles = Template:Sidebar/child example/styles.css
}}
Handling long links
{{Normalwraplink}} may be used to handle individual links that should wrap within the sidebar or otherwise need to be made to wrap, in order to prevent the sidebar from becoming too wide. Use {{normalwraplink|longlinkname}}
, where |longlinkname
is the long link without its square brackets.
Use the |wraplinks=true
parameter to enable link wrapping (disabling nowraplinks
CSS class) for the whole template.
Nesting
One sidebar template can be nested (embedded) into another one by using the |child=
parameter. This feature can be used to create a modular sidebar, or to create more well-defined and logical sections.
Top-level title | ||
---|---|---|
First subsection
|
||
Second subsection
|
||
"below" text |
{{Sidebar
| title = Top-level title
| content1 =
{{Sidebar |child=yes
| title = First subsection
| heading1 = Heading 1.1
| content1 = Content 1.1
}}
| content2 =
{{Sidebar |child=yes
| title = Second subsection
| heading1 = Heading 2.1
| content1 = Content 2.1
}}
| below = "below" text
}}
Note in the examples above that the child sidebar is placed in a content
field, not a heading
field. Notice also that the section subheadings do not appear in bold if this is not explicitly specified. To obtain bold section headings, move the titles to the heading
field, using
Top-level title | ||
---|---|---|
First subsection | ||
|
||
Second subsection | ||
|
||
"below" text |
{{Sidebar
| title = Top-level title
| heading1 = First subsection
| content1 =
{{Sidebar |child=yes
| heading1 = Heading 1.1
| content1 = Content 1.1
}}
| heading2 = Second subsection
| content2 =
{{Sidebar |child=yes
| heading1 = Heading 2.1
| content1 = Content 2.1
}}
| below = "below" text
}}
Deprecated parameters
The following parameters are deprecated in favor of TemplateStyles and templates/modules using them are categorized into Category:Sidebars with styles needing conversion. The category page has further conversion information.
A specific real conversion example is Template:DYK tools where the styles were moved to Template:DYK tools/styles.css.
Parameter | Explanation | TemplateStyles replacement class |
---|---|---|
|style= or |bodystyle=
|
Additional CSS for the whole sidebar. | Class assigned to the template in |class=
|
|basestyle=
|
Additional CSS for a grabbag of parameters: |pretitle= , |title= , |headingn= , and |listtitlen= (for {{sidebar with collapsible lists}}).
|
See related parameters for targeting pretitle, title, all headings, and all lists. Applies before the specific style parameter so must be placed above that parameter's declarations if any in the TemplateStyles sheet. |
|outertitlestyle=
|
Additional CSS for |outertitle= .
|
.sidebar-outer-title
|
|topimagestyle=
|
Additional CSS for |topimage= .
|
.sidebar-top-image
|
|topcaptionstyle=
|
Additional CSS for |topcaption= .
|
.sidebar-topcaption
|
|pretitlestyle=
|
Additional CSS for |pretitle= .
|
.sidebar-pretitle or .sidebar-pretitle-with-top-image
|
|titlestyle=
|
Additional CSS for |title= .
|
.sidebar-title or .sidebar-title-with-pretitle
|
|imagestyle=
|
Additional CSS for |image= .
|
.sidebar-image
|
|captionstyle=
|
Additional CSS for |caption= .
|
.sidebar-caption
|
|abovestyle=
|
Additional CSS for |above= .
|
.sidebar-above
|
|headingstyle=
|
Additional CSS for section headings. | .sidebar-heading
|
|headingnstyle=
|
Additional CSS for |headingn= .
|
Class assigned to the heading in |headingnclass=
|
|contentstyle=
|
Additional CSS for all section content. | .sidebar-content and/or .sidebar-content-with-subgroup
|
|contentnstyle=
|
Additional CSS for |contentn= .
|
Class assigned to the content in |contentnclass=
|
|belowstyle=
|
Additional CSS for |below= .
|
.sidebar-below
|
|navbarstyle=
|
Additional CSS for the generated navbar. | .sidebar-navbar
|
|navbarfontstyle=
|
Additional CSS passed to the navbar module to target the VTE (colors usually). | .sidebar-navbar li, .sidebar-navbar a
|
Tracking category
- Category:Pages using sidebar with the child parameter (3,778)
- Category:Sidebars with styles needing conversion (4,196)
See also
- Last pre-Lua version
- {{Sidebar with collapsible lists}}
- {{Infobox}}
- {{Side box}}
- Wikipedia:UBLIST, for help using unbulleted lists within content.