This is a documentation for Board Game Arena: play board games online !

Template:InfoBox: Difference between revisions

From Board Game Arena
Jump to navigation Jump to search
(remove box-sizing & width from mw-collapsible elements)
(Template:InfoBox update: optimisation, renaming of variables)
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
<div style="float:{{{float|none}}};clear:both;display:flex;margin:8px;"><div class="mw-collapsible mw-{{{state|}}}" style="display:flex;flex-flow:column wrap;min-width:{{{minWidth|}}};max-width:{{{maxWidth|600}}}px;border-radius:{{{corner|0.5}}}rem;background:{{{color|linear-gradient(to bottom right,{{{colorA|#c00}}},{{{colorB|#703}}},{{{colorC|#307}}})}}};"><div class="mw-collapsible-toggle" style="padding:0.5rem;text-align:{{{titleAlign|center}}};color:{{{titleColor|#fff}}};font-weight:bold;overflow-wrap:break-word;hyphens:auto;"><span>{{{title}}}</span></div><div class="mw-collapsible-content" style="margin:0 0.25rem 0.25rem;padding:0.25rem;border-radius:calc({{{corner|0.5}}}rem - 0.25rem);background:{{{bodyBgColor|#fffc}}};color:{{{bodyColor|#202122}}};overflow-wrap:break-word;hyphens:auto;"><span>{{{body}}}</span></div></div></div><noinclude>
<div style="float:{{{float|none}}};clear:both;display:flex;margin:8px;"><div class="mw-collapsible mw-{{{state|}}}"style="display:flex;flex-direction:column;min-width:{{{minWidth|}}};max-width:{{{maxWidth|600}}}px;border-radius:{{{corner|0.5}}}rem;background:{{{background|linear-gradient(135deg,{{{gradientA|#c00}}},{{{gradientB|#703}}},{{{gradientC|#307}}})}}};"><div class="mw-collapsible-toggle"style="padding:0.5rem;text-align:{{{titleAlign|center}}};color:{{{titleColor|#fff}}};font-weight:bold;overflow-wrap:break-word;hyphens:auto;">{{{title|Title}}}</div><div class="mw-collapsible-content"style="margin:0 0.25rem 0.25rem;padding:0.25rem;border-radius:calc({{{corner|0.5}}}rem - 0.25rem);background:{{{bodyBackground|#fffc}}};color:{{{bodyColor|#202122}}};overflow-wrap:break-word;hyphens:auto;">{{{body|Body}}}</div></div></div><noinclude>


To use this infoBox template, type:
To use this infoBox template, type:
<pre>
:{{code|<nowiki>{{infoBox</nowiki>}}
{{infoBox
:{{code|<nowiki>|title=YourTitle</nowiki>}}
|title=Example
:{{code|<nowiki>|body=YourBody</nowiki>}}
|body=
:{{code|<nowiki>}}</nowiki>}}
}}
Replace {{code|YourTitle}} and {{code|YourBody}} when editing the page.
</pre>
 
with the title and body when editing the page.


== Parameters ==
== Parameters ==


<div style="display:grid;grid-template-columns:repeat(4,max-content) 1fr;gap:0 0.25rem;overflow:auto;text-overflow:ellipsis;">
<div style="display:grid;grid-template-columns:repeat(3,max-content) 6rem 1fr;gap:0.5rem;overflow:auto;text-overflow:ellipsis;">
   <div style="font-weight:bold;width:8rem;">Parameter</div>
   <div>{{text|w=bold|Id}}</div>
   <div style="font-weight:bold;width:8rem;">Default value</div>
   <div>{{text|w=bold|Default}}</div>
   <div style="font-weight:bold;width:8rem;">Example</div>
   <div>{{text|w=bold|Example}}</div>
   <div style="font-weight:bold;width:8rem;">Result</div>
   <div>{{text|w=bold|Result}}</div>
   <div style="font-weight:bold;width:8rem;">Description</div>
   <div>{{text|w=bold|Description}}</div>
   <div><code>title</code></div>
   <div>{{code|title}}</div>
   <div><code>null</code></div>
   <div>{{code|Title}}</div>
   <div><code><nowiki>{{infoBox |title=Example}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |title=Example}}</nowiki>}}</div>
   <div>{{infoBox |title=Example}}</div>
   <div>{{infoBox |title=Example}}</div>
   <div>'''''Optional:''''' specify a title.</div>
   <div>Title</div>
   <div><code>body</code></div>
   <div>{{code|body}}</div>
   <div><code>null</code></div>
   <div>{{code|Body}}</div>
   <div><code><nowiki>{{infoBox |body=Body content}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |body=Content}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content}}</div>
   <div>{{infoBox |body=Content}}</div>
   <div>'''''Optional:''''' specify any body content.</div>
   <div>Text, images, other templates..</div>
   <div><code>state</code></div>
   <div>{{code|state}}</div>
   <div><code>null</code></div>
   <div>expanded</div>
   <div><code><nowiki>{{infoBox |state=collapsed}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |state=collapsed}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |state=collapsed}}</div>
   <div>{{infoBox |state=collapsed}}</div>
   <div>'''''Optional:''''' collapsed by default.</div>
   <div>Collapse into a button (wiki only).</div>
   <div><code>float</code></div>
   <div>{{code|float}}</div>
   <div><code>none</code></div>
   <div>{{code|none}}</div>
   <div><code><nowiki>{{infoBox |float=right}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |float=right}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |float=right}}</div>
   <div>{{infoBox |float=right}}</div>
   <div>'''''Optional:''''' Place on the <code>left</code> or <code>right</code> side of its container, allowing text to wrap around it.</div>
   <div>Place on the {{code|left}} or {{code|right}} side of its container, allowing text to wrap around it.</div>
   <div><code>minWidth</code></div>
   <div>{{code|minWidth}}</div>
   <div><code>null</code></div>
   <div>none</div>
   <div><code><nowiki>{{infoBox |minWidth=100%}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |minWidth=100%}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |minWidth=100%}}</div>
   <div>{{infoBox |minWidth=100%}}</div>
   <div>'''''Optional:''''' specify the minimum width as a [https://developer.mozilla.org/en-US/docs/Web/CSS/length CSS length] e.g. <code>500px</code>.</div>
   <div>Minimum width as a [https://developer.mozilla.org/en-US/docs/Web/CSS/length CSS length] e.g. {{code|500px}}.</div>
   <div><code>maxWidth</code></div>
   <div>{{code|maxWidth}}</div>
   <div><code>600</code></div>
   <div>{{code|600}}</div>
   <div><code><nowiki>{{infoBox |maxWidth=80}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |maxWidth=80}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |maxWidth=80}}</div>
   <div>{{infoBox |maxWidth=80}}</div>
   <div>'''''Optional:''''' specify the maximum width in px units.
   <div>Maximum width in px units.


 
'''''Tip:''''' {{code|<nowiki>{{infoBox |maxWidth=}}</nowiki>}} removes the maxWidth limit.</div>
'''''Tip:''''' use <code><nowiki>{{infoBox |maxWidth=}}</nowiki></code> (empty) to remove the maxWidth limit.</div>
   <div>{{code|background}}</div>
   <div><code>color</code></div>
   <div>gradient</div>
   <div><pre>linear-gradient(
   <div>{{code|<nowiki>{{infoBox |background=green}}</nowiki>}}</div>
to bottom right,
   <div>{{infoBox |background=green}}</div>
{{{colorA|#c00}}},
   <div>A solid color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
{{{colorB|#703}}},
   <div>{{code|gradientA}}</div>
{{{colorC|#307}}})</pre></div>
   <div>{{code|#c00}} (red)</div>
   <div><code><nowiki>{{infoBox |color=green}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |gradientA=lightgreen}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |color=green}}</div>
   <div>{{infoBox |gradientA=lightgreen}}</div>
   <div>'''''Optional:''''' specify a single color of the infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Top left color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>colorA</code></div>
   <div>{{code|gradientB}}</div>
   <div><code>#c00</code> (red)</div>
   <div>{{code|#703}} (dark pink)</div>
   <div><code><nowiki>{{infoBox |colorA=lightgreen}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |gradientB=lightgreen}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |colorA=lightgreen}}</div>
   <div>{{infoBox |gradientB=lightgreen}}</div>
   <div>'''''Optional:''''' specify the top left corner color gradient of the infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Middle color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>colorB</code></div>
   <div>{{code|gradientC}}</div>
   <div><code>#703</code> (dark pink)</div>
   <div>{{code|#307}} (dark blue)</div>
   <div><code><nowiki>{{infoBox |colorB=lightgreen}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |gradientC=lightgreen}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |colorB=lightgreen}}</div>
   <div>{{infoBox |gradientC=lightgreen}}</div>
   <div>'''''Optional:''''' specify the middle color gradient of the infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Bottom right color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>colorC</code></div>
   <div>{{code|bodyBackground}}</div>
   <div><code>#307</code> (dark blue)</div>
   <div>{{code|#fffc}} (translucent white)</div>
   <div><code><nowiki>{{infoBox |colorC=lightgreen}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |bodyBackground=lightgreen}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |colorC=lightgreen}}</div>
   <div>{{infoBox |bodyBackground=lightgreen}}</div>
   <div>'''''Optional:''''' specify the bottom right corner color gradient of the infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Body background color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>bodyBgColor</code></div>
   <div>{{code|titleColor}}</div>
   <div><code>#fffc</code> (translucent white)</div>
   <div>white</div>
   <div><code><nowiki>{{infoBox |bodyBgColor=lightgreen}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |titleColor=lightgreen}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |bodyBgColor=lightgreen}}</div>
   <div>{{infoBox |titleColor=lightgreen}}</div>
   <div>'''''Optional:''''' specify the body background color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Title text color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>titleColor</code></div>
   <div>{{code|bodyColor}}</div>
   <div><code>#fff</code> (white)</div>
   <div>{{code|#202122}} (black)</div>
   <div><code><nowiki>{{infoBox |titleColor=lightgreen}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |bodyColor=green}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |titleColor=lightgreen}}</div>
   <div>{{infoBox |bodyColor=green}}</div>
   <div>'''''Optional:''''' specify the title color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Body color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>bodyColor</code></div>
   <div>{{code|titleAlign}}</div>
   <div><code>#202122</code> (black)</div>
   <div>{{code|center}}</div>
   <div><code><nowiki>{{infoBox |bodyColor=green}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |titleAlign=left}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |bodyColor=green}}</div>
   <div>{{infoBox |titleAlign=left}}</div>
   <div>'''''Optional:''''' specify the title color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Title alignment ({{code|left}} or {{code|right}}).</div>
   <div><code>titleAlign</code></div>
   <div>{{code|corner}}</div>
   <div><code>center</code></div>
   <div>{{code|0.5}}</div>
   <div><code><nowiki>{{infoBox |titleAlign=left}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBox |corner=1}}</nowiki>}}</div>
   <div>{{infoBox |title=Example |body=Body content |titleAlign=left}}</div>
   <div>{{infoBox |corner=1}}</div>
   <div>'''''Optional:''''' specify the title alignment as <code>left</code> or <code>right</code>.</div>
   <div>Corner radius in [https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/length#rem rem units].</div>
   <div><code>corner</code></div>
   <div><code>0.5</code></div>
   <div><code><nowiki>{{infoBox |corner=1}}</nowiki></code></div>
   <div>{{infoBox |title=Example |body=Body content |corner=1}}</div>
   <div>'''''Optional:''''' specify the corner radius in rem units.</div>
</div>
</div>
----
----
{{infoBoxes}}
{{infoBoxes}}


To use a double infoBox template, type:
Double infoBox:
 
:{{code|<nowiki>{{</nowiki>infoBox'''es'''}}
<pre>
:{{code|<nowiki>|</nowiki>title'''1'''<nowiki>=</nowiki>}}
{{infoBoxes
:{{code|<nowiki>|</nowiki>body'''1'''<nowiki>=</nowiki>}}
|title1=Example 1
:{{code|<nowiki>|</nowiki>title'''2'''<nowiki>=</nowiki>}}
|body1=
:{{code|<nowiki>|</nowiki>body'''2'''<nowiki>=</nowiki>}}
|title2=Example 2
:{{code|<nowiki>}}</nowiki>}}
|body2=
}}
</pre>
 
with the title and body when editing the page.


== Additional parameters ==
== Additional parameters ==


<div style="display:grid;grid-template-columns:repeat(3,max-content) 1fr;gap:1rem;overflow:auto;text-overflow:ellipsis;">
<div style="display:grid;grid-template-columns:repeat(3,max-content) 1fr;gap:1rem;overflow:auto;text-overflow:ellipsis;">
   <div style="font-weight:bold;width:8rem;">Parameter</div>
   <div>{{text|w=bold|Id}}</div>
   <div style="font-weight:bold;width:8rem;">Default value</div>
   <div>{{text|w=bold|Default}}</div>
   <div style="font-weight:bold;width:8rem;">Example</div>
   <div>{{text|w=bold|Example}}</div>
   <div style="font-weight:bold;width:8rem;">Description</div>
   <div>{{text|w=bold|Description}}</div>
   <div><code>title'''#'''</code></div>
   <div>{{code|title'''#'''}}</div>
   <div><code>null</code></div>
   <div>{{code|Title'''#'''}}</div>
   <div><code><nowiki>{{infoBoxes |title2=Example}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBoxes |title2=Example}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify a title.</div>
   <div>Title where {{code|'''#'''}} is the InfoBox index.</div>
   <div><code>body'''#'''</code></div>
   <div>{{code|body'''#'''}}</div>
   <div><code>null</code></div>
   <div>{{code|Body'''#'''}}</div>
   <div><code><nowiki>{{infoBoxes |body2=Body content}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBoxes |body2=Content}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify any body content.</div>
   <div>Body where {{code|'''#'''}} is the InfoBox index.</div>
   <div><code>color'''#'''</code></div>
   <div>{{code|background'''#'''}}</div>
   <div><code>linear-gradient</code></div>
   <div>gradient</div>
   <div><code><nowiki>{{infoBoxes |color2=green}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBoxes |background2=green}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify a single color of each infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Solid color of each infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}} where {{code|'''#'''}} is the InfoBox index.</div>
   <div><code>colorD</code></div>
   <div>{{code|gradientD}}</div>
   <div><code>#00c</code> (blue)</div>
   <div>{{code|#00c}} (blue)</div>
   <div><code><nowiki>{{infoBoxes |colorD=green}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBoxes |gradientD=green}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify the bottom right corner color of the second infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Bottom right color of the last InfoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
   <div><code>title'''#'''color</code></div>
   <div>{{code|title'''#'''color}}</div>
   <div><code>#fff</code></div>
   <div>white</div>
   <div><code><nowiki>{{infoBoxes |title2Color=black}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBoxes |title2Color=black}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify the title color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Title text color as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}} where {{code|'''#'''}} is the InfoBox index.</div>
</div>
</div>


Line 150: Line 137:
{{infoBoxes3}}
{{infoBoxes3}}


To use a triple infoBox template, type:
Triple infoBox:
 
:{{code|<nowiki>{{</nowiki>infoBoxes'''3'''}}
<pre>
:{{code|<nowiki>|</nowiki>title1<nowiki>=</nowiki>}}
{{infoBoxes3
:{{code|<nowiki>|</nowiki>body1<nowiki>=</nowiki>}}
|title1=Example 1
:{{code|<nowiki>|</nowiki>title2<nowiki>=</nowiki>}}
|body1=
:{{code|<nowiki>|</nowiki>body2<nowiki>=</nowiki>}}
|title2=Example 2
:{{code|<nowiki>|</nowiki>title'''3'''<nowiki>=</nowiki>}}
|body2=
:{{code|<nowiki>|</nowiki>body'''3'''<nowiki>=</nowiki>}}
|title3=Example 3
:{{code|<nowiki>}}</nowiki>}}
|body3=
}}
</pre>
 
with the title and body when editing the page.


== Additional parameters ==
== Additional parameters ==


<div style="display:grid;grid-template-columns:repeat(3,max-content) 1fr;gap:1rem;overflow:auto;text-overflow:ellipsis;">
<div style="display:grid;grid-template-columns:repeat(3,max-content) 1fr;gap:1rem;overflow:auto;text-overflow:ellipsis;">
   <div style="font-weight:bold;width:8rem;">Parameter</div>
   <div>{{text|w=bold|Id}}</div>
   <div style="font-weight:bold;width:8rem;">Default value</div>
   <div>{{text|w=bold|Default}}</div>
   <div style="font-weight:bold;width:8rem;">Example</div>
   <div>{{text|w=bold|Example}}</div>
   <div style="font-weight:bold;width:8rem;">Description</div>
   <div>{{text|w=bold|Description}}</div>
   <div><code>colorE</code></div>
   <div>{{code|gradientE}}</div>
   <div><code>#037</code> (dark cyan)</div>
   <div>{{code|#037}} (dark cyan)</div>
   <div><code><nowiki>{{infoBoxes3 |colorE=green}}</nowiki></code></div>
   <div>{{code|<nowiki>{{infoBoxes3 |gradientE=green}}</nowiki>}}</div>
   <div>'''''Optional:''''' specify the bottom right corner color of the third infoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. <code>green</code>.</div>
   <div>Bottom right color of the last InfoBox as a [https://developer.mozilla.org/en-US/docs/Web/CSS/color CSS color] e.g. {{code|green}}.</div>
</div>
</div>
<noinclude>
== [[:Category:TextTemplates]] ==
{{Category:TextTemplates}}
== Pages using {{FULLPAGENAME}} ==
{{Special:WhatLinksHere/{{FULLPAGENAME}}}}
</noinclude>
[[Category:TextTemplates]]
[[Category:TextTemplates]]
</noinclude>

Latest revision as of 18:13, 10 February 2026

Title
Body

To use this infoBox template, type:

{{infoBox
|title=YourTitle
|body=YourBody
}}

Replace YourTitle and YourBody when editing the page.

Parameters

Id
Default
Example
Result
Description
title
Title
{{infoBox |title=Example}}
Example
Body
Title
body
Body
{{infoBox |body=Content}}
Title
Content
Text, images, other templates..
state
expanded
{{infoBox |state=collapsed}}
Title
Body
Collapse into a button (wiki only).
float
none
{{infoBox |float=right}}
Title
Body
Place on the left or right side of its container, allowing text to wrap around it.
minWidth
none
{{infoBox |minWidth=100%}}
Title
Body
Minimum width as a CSS length e.g. 500px.
maxWidth
600
{{infoBox |maxWidth=80}}
Title
Body
Maximum width in px units. Tip: {{infoBox |maxWidth=}} removes the maxWidth limit.
background
gradient
{{infoBox |background=green}}
Title
Body
A solid color as a CSS color e.g. green.
gradientA
#c00 (red)
{{infoBox |gradientA=lightgreen}}
Title
Body
Top left color as a CSS color e.g. green.
gradientB
#703 (dark pink)
{{infoBox |gradientB=lightgreen}}
Title
Body
Middle color as a CSS color e.g. green.
gradientC
#307 (dark blue)
{{infoBox |gradientC=lightgreen}}
Title
Body
Bottom right color as a CSS color e.g. green.
bodyBackground
#fffc (translucent white)
{{infoBox |bodyBackground=lightgreen}}
Title
Body
Body background color as a CSS color e.g. green.
titleColor
white
{{infoBox |titleColor=lightgreen}}
Title
Body
Title text color as a CSS color e.g. green.
bodyColor
#202122 (black)
{{infoBox |bodyColor=green}}
Title
Body
Body color as a CSS color e.g. green.
titleAlign
center
{{infoBox |titleAlign=left}}
Title
Body
Title alignment (left or right).
corner
0.5
{{infoBox |corner=1}}
Title
Body
Corner radius in rem units.

Title1
Body1
Title2
Body2

Double infoBox:

{{infoBoxes
|title1=
|body1=
|title2=
|body2=
}}

Additional parameters

Id
Default
Example
Description
title#
Title#
{{infoBoxes |title2=Example}}
Title where # is the InfoBox index.
body#
Body#
{{infoBoxes |body2=Content}}
Body where # is the InfoBox index.
background#
gradient
{{infoBoxes |background2=green}}
Solid color of each infoBox as a CSS color e.g. green where # is the InfoBox index.
gradientD
#00c (blue)
{{infoBoxes |gradientD=green}}
Bottom right color of the last InfoBox as a CSS color e.g. green.
title#color
white
{{infoBoxes |title2Color=black}}
Title text color as a CSS color e.g. green where # is the InfoBox index.

Title1
Body1
Title2
Body2
Title3
Body3

Triple infoBox:

{{infoBoxes3
|title1=
|body1=
|title2=
|body2=
|title3=
|body3=
}}

Additional parameters

Id
Default
Example
Description
gradientE
#037 (dark cyan)
{{infoBoxes3 |gradientE=green}}
Bottom right color of the last InfoBox as a CSS color e.g. green.

Category:TextTemplates

Text Templates

Pages using Template:InfoBox