Template:Float file box/doc: Difference between revisions

From Terraria Wiki
Jump to navigation Jump to search
Ryebot (talk | contribs)
(Removed invisible character U+200E ("Left-To-Right Mark").)
(ce, +examples, -category and interwiki links (now belong on the template page))
Line 1: Line 1:
This is an alternative version of {{tl|float file}}. It is similarly used to display an image to the left of an infobox, but it additionally accommodates placing long captions on small images (small images usually cause long captions to cut off and/or break into many unsightly lines). It will also accommodate placing one caption under multiple small images.
This is an alternative version of {{tl|float file}}. It is similarly used to display an image to the left of an infobox, but it additionally accommodates placing long captions on small images (small images usually cause long captions to cut off and/or break into many unsightly lines). It will also accommodate placing one caption under multiple small images.


== Parameters ==
== Usage ==
<code>{{(}} float file box | ''&lt;image wiki code&gt;'' | ''&lt;image caption&gt;'' | title = ''&lt;box title&gt;'' | float = ''right/left'' | width = ''&lt;box width&gt;'' | css/style = ''&lt;custom box styling&gt;'' | image-css = ''&lt;custom image styling&gt;'' | caption-css | ''&lt;custom caption styling&gt;'' {{)}}</code>
;1 (unnamed parameter)
:image name(s). <code><nowiki>[[</nowiki>File:<imagename>]]</code> omitting only the caption text. Multiple images allowed.
;2 (unnamed parameter)
:caption text
;float
:default is <code>right</code>
;width
:default is <code>150px</code>
;css/style
:optional css style
;title
:option title; displayed above the image(s)
;image-css
:optional css style for image(s)
:e.g. image-css = style="<css>" (or class="<class>")
;caption-css
:optional css style for caption text


; First unnamed parameter
== Example ==
Complete wiki code for the image, including brackets.


; Second unnamed parameter
<code>{{(}} '''float file box''' | <nowiki>[[</nowiki>''File:Something.png'']] | ''This is a long image caption. This is a long image caption.'' | width = ''200px'' {{)}}</code>
Text of the caption beneath the image.

; title
Text displayed as the title of the box.

; float
Float position, defaults to <code>right</code>.

; width
Width of the box, defaults to <code>150px</code>.

; css/style
Additional styling for the entire box.

; image-css
Styling for the image, in the format of table row styling (e.g. <code>| image-css = class="myclass" style="color:red"</code>).

; caption-css
Styling for the caption, in the format of table row styling.

== Examples ==
{| class="wikitable"
! Code !! Result
|-
| <code><nowiki>{{float file box|[[File:Dye test on Orichalcum armor (Pink Dye).png]]|This very long caption would normally look ''very awkward'' underneath this narrow image of [[Orichalcum armor]] being dyed with [[Pink Dye]].}}</nowiki></code>
| {{float file box|[[File:Dye test on Orichalcum armor (Pink Dye).png]]|This very long caption would normally look ''very awkward'' underneath this narrow image of [[Orichalcum armor]] being dyed with [[Pink Dye]].}}
|-
| <code><nowiki>{{float file box|[[File:Tree.png|link=]]|This is an image of a tree.|title=CSS demo|width=90px|css=border-width:3px|image-css=style="background-color:var(--custom-notice-red-background-color)"|caption-css=class="terraria" style="color:var(--theme-text-color-note)"}}</nowiki></code>
| {{float file box|[[File:Tree.png|link=]]|This is an image of a tree.|title=CSS demo|width=90px|css=border-width:3px|image-css=style="background-color:var(--custom-notice-red-background-color)"|caption-css=class="terraria" style="color:var(--theme-text-color-note)"}}
|}


<includeonly>
{{category|Formatting templates}}
[[de:Vorlage:Float file box]]
[[fr:Modèle:Float file box]]
[[ko:틀:Float file box]]
[[ru:Шаблон:Изображение с подписью]]
</includeonly>
<noinclude>
<noinclude>
{{category|Template documentation}}
{{category|Template documentation}}

Revision as of 20:18, 23 June 2022

This is an alternative version of {{float file}}. It is similarly used to display an image to the left of an infobox, but it additionally accommodates placing long captions on small images (small images usually cause long captions to cut off and/or break into many unsightly lines). It will also accommodate placing one caption under multiple small images.

Usage

{{ float file box | <image wiki code> | <image caption> | title = <box title> | float = right/left | width = <box width> | css/style = <custom box styling> | image-css = <custom image styling> | caption-css | <custom caption styling> }}

First unnamed parameter

Complete wiki code for the image, including brackets.

Second unnamed parameter

Text of the caption beneath the image.

title

Text displayed as the title of the box.

float

Float position, defaults to right.

width

Width of the box, defaults to 150px.

css/style

Additional styling for the entire box.

image-css

Styling for the image, in the format of table row styling (e.g. | image-css = class="myclass" style="color:red").

caption-css

Styling for the caption, in the format of table row styling.

Examples

Code Result
{{float file box|[[File:Dye test on Orichalcum armor (Pink Dye).png]]|This very long caption would normally look ''very awkward'' underneath this narrow image of [[Orichalcum armor]] being dyed with [[Pink Dye]].}}
Dye test on Orichalcum armor (Pink Dye).png
This very long caption would normally look very awkward underneath this narrow image of Orichalcum armor being dyed with Pink Dye.
{{float file box|[[File:Tree.png|link=]]|This is an image of a tree.|title=CSS demo|width=90px|css=border-width:3px|image-css=style="background-color:var(--custom-notice-red-background-color)"|caption-css=class="terraria" style="color:var(--theme-text-color-note)"}}
CSS demo
Tree.png
This is an image of a tree.