Sjaboon:afbeelding/doc

Since MediaWiki does not provide a way to add visible captions to images integrated seamlessly in a page (i.e, without borders), this template aims to provide that functionality.

Usage

This template can be either with named parameters, as in

{{afbeelding|image=Example.svg|caption=Example text|width=250px|align=right|caption position=bottom}}

...or in its shorthand form:

{{afbeelding|Example.svg|Example text|250px|right|bottom}}

• The only compulsory parameters are image and caption.
• When using the shorthand version, keep in mind that the order of parameters is important

Parameter	Default	Acceptable values
image	mandatory	any image filename ("File:" or "Image:" is optional)
caption	mandatory	any valid wiki markup
width	250px	any pixel width ("px" suffix optional)
align	right	left, center, right
caption position	bottom	top, bottom
triangle	none	triangle, none
triangle color	#ff0080	any css color
image override		Anything (lets you replace the image block with anything—useful for stacking image overlays)
caption override		Anything (lets you replace the caption block with anything)

—Examples—

The triangle parameters give the option to add a colored triangle label— Sjabloon:Afbeelding {{afbeelding|James Webb Space Telescope Mirror37.jpg|This is a picture of the [[James Webb Space Telescope]].|350|left|top|triangle|rgba(0,110,255,1)}}

Using "image-override" to stack images

Sjabloon:Plain image {{Plain image|File:Helical granum.png|'''Grana structure''' The prevailing model for [[granum|granal]] structure is a stack of granal [[thylakoids]] linked by helical [[stroma (fluid)|stromal]] thylakoids that wrap around the grana stacks and form large sheets that connect different grana.|432px|left|top|triangle|#3cb14d|image override=<div style="float: right; position: relative; width: 432px; height: 432px;"> <div style="float: right; position: absolute; width: 432px;">[[File:Helical granum.png|432px]]</div> <div style="float: right; position: absolute; width: 432px;">[[File:Granum labels.svg|432px|The prevailing model for [[granum|granal]] structure.]]</div>}}

See also

• Sjabloon:Tl
• Sjabloon:Tl
• Sjabloon:Tl

<templatedata> {

       "description": "A template for adding a caption to a frameless image",
       "params": {
               "image": {
                       "label": "Image",
                       "description": "The image to use. The File: prefix is optional.",
                       "type": "string",
                       "default": "—",
                       "required": true

},

               "caption": {
                       "label": "Image caption and alt text",
                       "description": "The caption to display under or above the image. Also sets the alt text.",
                       "type": "string",
                       "default": "—",
                       "required": true
                    },
               "width": {
                       "label": "Image width",
                       "description": "Sets the pixel width of the image and the template. the px suffix is optional.",
                       "type": "number",
                       "default": "250px",
                       "required": false
                    },
               "align": {
                       "label": "Float and center",
                       "description": "Floats the template to the left, right, or centers it. Accepts left, center, or right.",
                       "type": "string",
                       "default": "right",
                       "required": false
                    },
               "caption position": {
                       "label": "Caption position",
                       "description": "Determines whether the caption goes above or below the image. Accepts top or bottom.",
                       "type": "string",
                       "default": "bottom",
                       "required": false
                    },
               "triangle": {
                       "label": "Triangle pointer",
                       "description": "Allows you to add a triangular pointer next to the caption text. Accepts triangle or none.",
                       "type": "string",
                       "default": "none",
                       "required": false
                    },
               "triangle color": {
                       "label": "Triangle pointer color",
                       "description": "Lets you set a CSS color for the triangular pointer.",
                       "type": "string",
                       "default": "#ff0080",
                       "required": false
                    },
               "image override": {
                       "label": "Replacement content for the image",
                       "description": "Lets you substitute any allowed HTML where the image would normally be.",
                       "type": "string",
                       "default": "—",
                       "required": false
                    },
               "caption override": {
                       "label": "Replacement content for the caption",
                       "description": "Lets you substitute any allowed HTML where the caption would normally be.",
                       "type": "string",
                       "default": "—",
                       "required": false
                    }
               }

} </templatedata>