⚠️ Please see plans to display ads on bg3.wiki. ⚠️

Template:Image frame: Difference between revisions

From bg3.wiki
Jump to navigation Jump to search
(Added template parameter aliases)
(Added link param)
Line 1: Line 1:
<includeonly><!--
<includeonly><!--
Image width. Defaults to a square aspect ratio if only height is provided
Image width. Defaults to a square aspect ratio if only height is provided.
-->{{#lvardef: width | {{{width|{{{w|{{{height|{{{h|100}}}}}}}}}}}}}}<!--
-->{{#lvardef: width | {{{width|{{{w|{{{height|{{{h|100}}}}}}}}}}}}}}<!--
Image height. Defaults to a square aspect ratio if only width is provided
Image height. Defaults to a square aspect ratio if only width is provided.
-->{{#lvardef: height | {{{height|{{{h|{{{width|{{{w|100}}}}}}}}}}}}}}<!--
-->{{#lvardef: height | {{{height|{{{h|{{{width|{{{w|100}}}}}}}}}}}}}}<!--
Border width. If this is 0, the outer div used for the border will not be created.
Border width. If this is 0, the outer div used for the border will not be created.
-->{{#lvardef: border-width | {{{border-width|{{{bw|4}}}}}}}}<!--
-->{{#lvardef: border-width | {{{border-width|{{{bw|4}}}}}}}}<!--
Border frame shape. This can be either an arbitrary clip-path or one of the predefined values
Border frame shape. This can be either an arbitrary clip-path or one of the predefined values.
-->{{#lvardef: clip-path|{{#switch:{{{border-shape|{{{bs|rounded}}}}}}
-->{{#lvardef: clip-path|{{#switch:{{{border-shape|{{{bs|rounded}}}}}}
| rounded = xywh(0 0 100% 100% round 15%)
| rounded = xywh(0 0 100% 100% round 15%)
Line 24: Line 24:
   height:      {{#lvar:height}}px;
   height:      {{#lvar:height}}px;
   clip-path:  {{#lvar:clip-path}};
   clip-path:  {{#lvar:clip-path}};
">[[File:{{{image|{{{1|}}}}}}|{{#lvar:width}}x{{#lvar:height}}px]]</div>
">[[File:{{{image|{{{1|}}}}}}|{{#lvar:width}}x{{#lvar:height}}px|link={{{link|{{{2|}}}}}}]]</div>
{{#ifexpr: {{#lvar:border-width}} > 0|</div>|}}</includeonly><noinclude>
{{#ifexpr: {{#lvar:border-width}} > 0|</div>|}}</includeonly><noinclude>
== Template data ==
== Template data ==
Line 37: Line 37:
             "type": "wiki-file-name",
             "type": "wiki-file-name",
             "required": true
             "required": true
        },
        "2": {
            "label": "Link",
            "description": "Clicking the image redirects to this link instead of the image file.",
            "aliases": ["link"],
            "type": "wiki-page-name",
            "suggested": true,
            "required": false
         },
         },
         "height": {
         "height": {
Line 91: Line 99:
{{User:NtCarlson/Template:Foo
{{User:NtCarlson/Template:Foo
| image = Portrait Lae'zel.png
| image = Portrait Lae'zel.png
| link = Lae'zel
| width = 120
| width = 120
| border-shape = diamond
| border-shape = diamond
Line 99: Line 108:
{{User:NtCarlson/Template:Foo
{{User:NtCarlson/Template:Foo
| image = Portrait Lae'zel.png
| image = Portrait Lae'zel.png
| link = Lae'zel
| h  = 120
| h  = 120
| bs = rounded
| bs = rounded
Line 108: Line 118:
{{User:NtCarlson/Template:Foo
{{User:NtCarlson/Template:Foo
| image = Portrait Lae'zel.png
| image = Portrait Lae'zel.png
| link = Lae'zel
| height = 120
| height = 120
| border-shape = polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
| border-shape = polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
Line 115: Line 126:
</nowiki>
</nowiki>
| <nowiki>
| <nowiki>
{{User:NtCarlson/Template:Foo
{{User:NtCarlson/Template:Foo|Portrait Lae'zel.png|Lae'zel|h=120|bw=0}}
| image = Portrait Lae'zel.png
| h = 120
| bw = 0
}}
</nowiki>
</nowiki>
}}
}}
</noinclude>
</noinclude>

Revision as of 20:56, 20 July 2024

Template data

Render an image cropped into a frame of arbitrary shape.

Template parameters

ParameterDescriptionTypeStatus
Image1 image

The image file to display.

Filerequired
Link2 link

Clicking the image redirects to this link instead of the image file.

Page namesuggested
Heightheight h

The height of the image in pixels (does not include any additional height from the border size).

Default
Same value as width, if defined. 100 otherwise.
Numbersuggested
Widthwidth w

The width of the image in pixels (does not include any additional width from the border size).

Default
Same value as height, if defined. 100 otherwise.
Numberoptional
Border shapeborder-shape bs

The shape of the border frame. It can be an arbitrary CSS clip path or use one of the predefined values.

Suggested values
rounded diamond basic
Default
rounded
Example
polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)
Stringsuggested
Border colorborder-color bc

The color of the border frame. This can be any CSS color descriptor.

Default
black
Stringoptional
Border widthborder-width bw

The thickness of the border frame in pixels. Set this to 0 to disable the border entirely.

Default
4
Numberoptional

Examples

Markup Renders as 
{{User:NtCarlson/Template:Foo
| image = Portrait Lae'zel.png
| link = Lae'zel
| width = 120
| border-shape = diamond
| border-width = 4
}}

User:NtCarlson/Template:Foo 

{{User:NtCarlson/Template:Foo
| image = Portrait Lae'zel.png
| link = Lae'zel
| h  = 120
| bs = rounded
| bw = 2
| bc = red
}}

User:NtCarlson/Template:Foo 

{{User:NtCarlson/Template:Foo
| image = Portrait Lae'zel.png
| link = Lae'zel
| height = 120
| border-shape = polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);
| border-width = 2
| border-color = #3d3d3d
}}

User:NtCarlson/Template:Foo 

{{User:NtCarlson/Template:Foo|Portrait Lae'zel.png|Lae'zel|h=120|bw=0}}

User:NtCarlson/Template:Foo

Retrieved from "https://bg3.wiki/w/index.php?title=Template:Image_frame&oldid=209418"