Template:Multiple image/doc

This template creates a box with two to ten images arranged vertically or horizontally with captions for the entire box and/or for each images.

czE3xW Fantastic blog.Thanks Again. Awesome.

Examples

60px

60px

Players are cautioned with a yellow card and sent off with a red card.

{{multiple image
| footer    = Players are cautioned with a yellow card and sent off with a red card.
| width     = 60

| image1    = Yellow card.svg
| alt1      = Yellow cartouche

| image2    = Red card.svg
| alt2      = Red cartouche
}}

PNG transparency demonstration

200px

A PNG image with an 8-bit transparency layer...

200px

...here overlaid onto a checkered background.

{{multiple image
| align     = left
| direction = vertical
| header    = [[PNG]] transparency demonstration
| width     = 200

| image1    = PNG transparency demonstration 1.png
| alt1      = Colored dice with white background
| caption1  = A PNG image with an 8-bit transparency layer...

| image2    = PNG transparency demonstration 2.png
| alt2      = Colored dice with checkered background
| caption2  = ...here overlaid onto a checkered background.
}}

60px

60px

60px

When a user has many of one type of barnstar,

they can represent them with ribbons and these numerals to indicate the count.

{{multiple image
| footer   = When a user has many of one type of [[WP:BARN|barnstar]],
they can represent them with [[WP:RIBBON|ribbons]]
and these numerals to indicate the count.
| width    = 60

| image1   = Ribbon numeral 2.png
| alt1     = 2

| image2   = Ribbon numeral 3.png
| alt2     = 3

| image3   = Ribbon numeral 4.png
| alt3     = 4
}}

Example with background color

160px

160px

160px

Adoxa (Adoxa moschatellina)

{{multiple image
| image1=Adoxa_moschatellina_210406.jpg
| alt1=Green herb with a few tiny yellow-white flowers

| image2=Adoxa_moschatellina_210406a.jpg
| alt2=Three small white and yellow flowers before green-leaf background

| image3=adoxa_moschatellina_blatt.jpeg
| alt3=Leaves of a plant. They are in groups of three, each with three lobes.

| footer=[[Adoxa]] (''Adoxa moschatellina'')
| footer_background=#BBDD99
| background color=#BBDD99
| footer_align=center
| width=160
}}

Example with links

143pxIB9xJb Thank you for your article.Much thanks again.link=Mule

A mule
骡子, luózi

150pxIB9xJb Thank you for your article.Much thanks again.link=

A donkey
驴子, lǘzi

91px

A fish
鱼, yú

The mule links to Mule, the donkey does not link anywhere, and the trout links to its image description page as usual.

{{multiple image
| footer    = The mule links to ''[[Mule]]'', the donkey does not link anywhere, and the trout links to its image description page as usual.
| align     = left

| image1    = Frecklesmule.jpg
| width1    = 143
| alt1      = A mule
| caption1  = <center>A mule<br />骡子, ''luózi''</center>
| link1     = Mule

| image2    = Donkey 1 arp 750px.jpg
| width2    = 150
| alt2      = A donkey
| caption2  = <center>A donkey<br />驴子, lǘzi</center>
| link2     =

| image3    = Rainbow_trout.png
| width3    = 91
| alt3      = A trout
| caption3  = <center>A fish<br />
{{lang|zh|2=鱼}}, ''yú''</center>
}}

Horizontal placement

Vertical direction places the images on one straight line (column) downwards from the first image, while horizontal direction places the images left to right on multiple lines (rows):

vertical

60px

60px

60px

horizontal

60px

60px

60px

However, this will not be apparent if only two images are used, as the template with "direction = horizontal" will place both images on different lines (rows), creating a blank space. Thus Template:Double image must be used. Similarly, if one wishes to display three images side-by-side on one line, Template:Triple image must be used.

Matching image heights

This trick is not required if all images have the same aspect ratio, where |width= suffices

• Decide on a common height for the images, say 100 pixels.
• Examine the individual image pages to obtain the full resolution. For example:
  • File:Donkey 1 arp 750px.jpg shows "Donkey_1_arp_750px.jpg (750 × 536 pixels, file size: 125 KB, MIME type: image/jpeg)"
  • File:Rainbow trout.png shows "Rainbow_trout.png (300 × 300 pixels, file size: 158 KB, MIME type: image/png)"
• For non-square images, use these figures to construct an expression for the |widthn= parameters, of the form:
  • {{#expr: (dh * ow / oh) round 0}}
• where
  • dh is the desired height in pixels (100)
  • ow is the original width in pixels (750 or 300)
  • oh is the original height in pixels (536 or 300)
• For square images, simply set the appropriate |widthn= to be the desired height. If all are square, only |width= needs to be set.

140px

A donkey, not square and originally 536 pixels high

100px

A fish, square and originally 300 pixels high

The two images are both rendered 100 pixels high

{{multiple image
| footer    = The two images are both rendered 100 pixels high
| align     = right

| image1    = Donkey 1 arp 750px.jpg
| width1    = {{#expr: (100 * 750 / 536) round 0}}
| alt1      = A donkey
| caption1  = A donkey, not square and originally 536 pixels high

| image2    = Rainbow_trout.png
| width2    = 100
| alt2      = A trout
| caption2  = A fish, square and originally 300 pixels high
}}

See also

• {{Auto images}} – automatically sizes a set of horizontal images
• {{Double image}}
• {{Triple image}}
• {{Gallery}}