Template:Multiple image/doc

This template creates a box containing between two and ten images, arranged either vertically or horizontally and with captions for the entire box or per image. With the appropriate choice of parameters, the template can automatically resize images to a given total width with each image having the same height.

Be aware that this template does not respect users’ default image size preferences. Except with very good reason, do not use px which forces a fixed image width. A fixed width in pixels may only be specified where absolutely necessary.

If image size parameters are omitted, this template sets all images at 200px wide, regardless of whether the reader has set a preference for some other default image width. This causes multiple images to look out of scale to the other images in an article.

Syntax

Provide |height[n]= and |total_width= parameters to obtain automatic resizing. Note the different meanings of the |width[n]= parameters with versus without automatic resizing. Please also note the option to set a |total_width= parameter at the beginning of the template:multiple image.

No automatic resizing of all images to the same height

{{Multiple image|perrow = 1|total_width = 600
<!-- Layout parameters -->
|align			= <!-- right (default), left, center, none --> 
|direction		= <!-- horizontal (default), vertical -->
|background color	= <!-- box background -->
|width			= <!-- displayed width of each image in pixels (an integer, omit “px” suffix); overrides <code>width[n]</code> below -->
|caption_align		= <!-- left (default), center, right --> 
|image_style		= <!-- border:1; (default) -->
|image_gap		= <!-- 5 (default)-->

<!-- Header -->
|header_background	= <!-- header background -->
|header_align		= <!-- center (default), left, right -->
|header			= <!-- header text -->

<!-- Image 1 -->
|image1			= <!-- filename only, i.e. without “File:” or “Image:” prefix -->
|width1			= <!-- displayed width of image; overridden by {{para|width}} above -->
|alt1			=
|link1			=
|thumbtime1		=
|caption1		=

<!-- Image 2 -->
|image2			= <!-- filename only, i.e. without “File:” or “Image:” prefix -->
|width2			= <!-- displayed width of image; overridden by {{para|width}} above -->
|alt2			=
|link2			=
|thumbtime2		=
|caption2		=

<!-- and so on, to a maximum of 10 images (image10) -->

<!-- Footer -->
|footer_background	= <!-- footer background -->
|footer_align		= <!-- left (default), center, right -->
|footer			= <!-- footer text -->
}}

Automatic resizing of all images to the same height and to a given total width

{{multiple image
<!-- Layout parameters -->
|align			= <!-- right (default), left, center, none --> 
|direction		= <!-- horizontal (default), vertical -->
|background color	= <!-- box background -->
|total_width		= <!-- total width of all the displayed images in pixels (an integer, omit “px” suffix) -->
|caption_align		= <!-- left (default), center, right --> 

<!-- Header -->
|header_background	=
|header_align		= <!-- center (default), left, right -->
|header			= 

<!-- Image 1 -->
|image1			= <!-- filename only, i.e. without “File:” or “Image:” prefix -->
|alt1			=
|link1			=
|thumbtime1		=
|caption1		=

<!-- Image 2 -->
|image2			= <!-- filename only, i.e. without “File:” or “Image:” prefix -->
|alt2			=
|link2			=
|thumbtime2		=
|caption2		=

<!-- and so on, to a maximum of 10 images (image10) -->

<!-- Footer -->
|footer_background	=
|footer_align		= <!-- left (default), center, right -->
|footer			=
}}

Parameters

|align= 

Right (default), center, or left.

|direction= 

Horizontal (default) or vertical.

|background color= 

To set the background color of the box in which the images appear.

|header_background= 

|header_align= 

Center (default), left, or right.

|header= 

|width= 

Use to set the same width for each image (i.e. overrides any |width[n]= below). Do not include if different image widths intended, including if images are to be resized to a fixed total width.

|total_width= 

Use to scale the images to the same height and this total width. Do not use both |total_width= and |width=.

|image[n]= 

(where [n] = 1 to 10) Filename of [n]th image.

|width[n]= 

As above. Two meanings:

1. The width (in pixels, integer, omit “px”) of [n]th image. Overridden by |width= if set.
2. The full width of the original [n]th image if |total_width= is given in order to resize all images to the same height and a given total width.

|height[n]= 

As above. The full height of the original [n]th image if |total_width= is given in order to resize all images to the same height and a given total width. Ignored otherwise.

|alt[n]= 

As above. Alt description for [n]th image.

|link[n]= 

As above. The page linked to the [n]th image (i.e. the page that is loaded when the image is clicked).

• If this parameter is omitted altogether, the image will link to its image description page as usual.
• If this parameter is present but left empty (i.e. ...|link1= |...), the image will not link to anything – this should be the case only for purely decorative images.

|thumbtime[n]= 

As above. When using video files, sets the time within the video that is used for the initial display. This is either a number of seconds or hours:minutes:seconds.

|caption[n]= 

As above. Caption for the [n]th image.

|caption_align= 

Left (default), center, or right.

|footer_background= 

|footer_align= 

Left (default), center, or right.

|footer= 

Caption that spans the entire box, as opposed to individual images. Avoid “left” and “right” if possible, since mobile devices may display the images vertically.

Examples

With footer

Pills

Cumdoom

Pregnax

The pills are given by Dr. Singh

{{multiple image
|caption_align = center
|header = Pills
|width = 109
|image1 = Cumdoom pills icon.png
|link1 = [[Cumdoom pills]]
|alt1 = Cumdoom pills icon
|caption1 = Cumdoom
|image2 = Pregnax pills icon.png
|link2 = [[Pregnax pills]]
|alt2 = Pregnax pills icon
|caption2 = Pregnax
|footer = The pills are given by Dr. Singh
}}

With background color, direction and links

Statue parts

Legs

Torso

Head

{{multiple image
|background color = Grey
|direction = vertical
|header = Statue parts
|width = 109
|image1 = Mysterious statue (legs) icon.png
|link1 = Mysterious statue (legs)
|caption1 = Legs
|image2 = Mysterious statue (torso) icon.png
|link2 = Mysterious statue (torso)
|caption2 = Torso
|image3 = Mysterious statue (head) icon.png
|link3 = Mysterious statue (head)
|caption3 = Head
}}

With multiple rows

To create an array of images, with multiple rows, use |perrow=. The value passed to |perrow= may be a single number, or a list of numbers delimited by /. This feature may also be combined with |total_width= for multiple rows of images with the same total width.

Aqua’s route main steps

{{multiple image|perrow = 2|total_width = 300
|header = Aqua’s route main steps
|image1 = Raven Hill Treasure Scroll Tree Hole.jpg
|image2 = Treasure Moon puzzle.jpg
|image3 = Treasure Code.jpg
|image4 = Aqua Maze minigame icon.jpg
}}