Editing Help/Images (section)

=== Syntax === <!--T:26-->

<!--T:27-->
The full syntax for displaying an image is:
</translate>
 <nowiki>[[</nowiki>File:<translate><!--T:285--> ''filename.extension''</translate>|<translate><!--T:286--> ''options''</translate>|<translate><!--T:287--> ''caption''</translate><nowiki>]]</nowiki>

<translate>
<!--T:28-->
where ''options'' can be empty or containing one or more of the following lower-case words, separated by pipes ('''|'''):
</translate>

* <translate><!--T:29--> ''[[<tvar name=1>#Format</tvar>|Format]]'' option: '''border''', and one of '''frameless''', '''frame''' (or '''framed'''), or '''thumb''' (or '''thumbnail''').</translate>  <translate><!--T:307--> <tvar name=1>'''border'''</tvar> can be used in combination with <tvar name=2>'''frameless'''</tvar> but will be ignored if used with one of the other options.</translate>
*: <translate><!--T:30--> Controls how the rendered image is formatted and embedded in the rest of the page.</translate>
* <translate><!--T:31--> ''[[<tvar name=1>#Size and frame</tvar>|Resizing]]'' option: one of</translate>
** <translate><!--T:32--> ''{width}'''''px''' &ndash; Resizes the image to fit within the given maximum width in pixels, without restricting its height.</translate> (<translate><!--T:264--> Only whole-number pixel values are supported.</translate> <translate><!--T:223--> A space character between the width value and "px" is permitted.</translate>)
** <translate><!--T:33--> '''x'''''{height}'''''px''' &ndash; Resizes the image to fit within the given maximum height in pixels, without restricting its width.</translate> <translate><!--T:265--> Only whole-number pixel values are supported.</translate> <translate><!--T:266--> A space character between the height value and "px" is permitted.</translate>
** <translate><!--T:34--> ''{width}'''''x'''''{height}'''''px''' &ndash; Resizes the image to fit within the given width and height in pixels.</translate> <translate><!--T:267--> Only whole-number pixel values are supported.</translate> <translate><!--T:268--> A space character between the width value and "px" is permitted.</translate>
** '''upright''' &ndash; <translate><!--T:35--> Resizes an image to a multiple of the user's thumbnail size preferences (see <tvar name=1><code></code></tvar>) – or the default thumbnail size, for logged-out users or logged-in users who have not changed their preferences – to fit within reasonable dimensions.</translate> <translate><!--T:275--> This option is often useful for images whose height is larger than their width.</translate> <translate><!--T:276--> Requires either <tvar name=1>'''thumb'''</tvar> or <tvar name=2>'''frameless'''</tvar>.</translate> <translate><!--T:224--> Setting <tvar name=1><code>|upright=1.0|</code></tvar> will display the image at the user's default image width.</translate> <translate><!--T:225--> <tvar name=1><code>|upright=2.0|</code></tvar> will display the image at double the user's default width.</translate>
*: <translate><!--T:226--> The image will always retain its aspect ratio.</translate>
*: <translate><!--T:227--> Images in non-scalable media types can be reduced in size, but not increased; e.g., bitmap images cannot be scaled up.</translate>
*: <translate><!--T:228--> The <tvar name=1><code>upright</code></tvar> setting does not require an equals sign, i.e. <tvar name=2><code>|upright 2.0|</code></tvar> works the same as <code>|upright=2.0|</code>.</translate>
*: <translate><!--T:229--> When used without a value or an equals sign (e.g., <tvar name=1><code>|upright|</code></tvar>), defaults to <tvar name=2><code>|upright=0.75|</code></tvar> (although <tvar name=3><code>|upright=|</code></tvar> is the same as <tvar name=4><code>|upright=1.0|</code></tvar>)</translate>
*: <translate><!--T:37--> The default maximum size depends on the ''format'' and the internal image dimensions (according to its media type).</translate>
* <translate><!--T:38--> ''[[<tvar name=1>#Horizontal alignment</tvar>|Horizontal alignment]]'' option: one of '''left''', '''right''', '''center''', '''none'''.</translate> <translate><!--T:234--> If multiple of these options are present, only the first one will be used</translate>
*: <translate><!--T:39--> Controls the horizontal alignment (and inline/block or floating styles) of the image within a text (no default value).</translate>
* <translate><!--T:40--> ''[[<tvar name=1>#Vertical alignment</tvar>|Vertical alignment]] option'': one of '''baseline''', '''sub''', '''super''', '''top''', '''text-top''', '''middle''', '''bottom''', '''text-bottom'''</translate>
*: <translate><!--T:41--> Controls the vertical alignment of a non-floating inline image with the text before or after the image, and in the same block (the default vertical alignment is '''middle''').</translate>
* <translate><!--T:42--> ''[[<tvar name=1>#Altering the default link target</tvar>|Link]] option'': one of</translate>
** <translate><!--T:43--> '''<tvar name=1>link</tvar>='''''{target}'' &ndash; Allows to change the target (to an arbitrary page title, or URL) of the generated link, activable on the rendered image surface; e.g. <tvar name=code><code><nowiki>[[File:Example.jpg|20px|link=http://www.wikipedia.org]]</nowiki></code></tvar> renders as <tvar name=code2>[[File:Example.jpg|20px|link=http://www.wikipedia.org]]</tvar> (external link), or <tvar name=code3><code><nowiki>[[File:Example.jpg|20px|link=MediaWiki]]</nowiki></code></tvar> renders as <tvar name=code4>[[File:Example.jpg|20px|link=MediaWiki]]</tvar> (internal link).</translate>
** <translate><!--T:44--> '''<tvar name=2>link</tvar>=''' (with an empty value) &ndash; (<tvar name=1>[[rev:41727|MediaWiki 1.14+]]</tvar>) Displays an image without any activable link; e.g. <tvar name=code1><code><nowiki>[[File:Example.jpg|20px|link=]]</nowiki></code></tvar> renders as <tvar name=code2>[[File:Example.jpg|20px|link=]]</tvar>.</translate>
*: <translate><!--T:235--> If there is a space character between <tvar name=1><code>link</code></tvar> and the equals sign, the link statement will be treated as a caption.</translate>
*: <translate><!--T:254--> Including some HTML character equivalents, like <tvar name=1><code>%22</code></tvar> for <tvar name=2><code>"</code></tvar>, can cause the link statement to be treated as a caption (see <tvar name=3>[[phabricator:T306216]]</tvar>).</translate>
<!--*** '''!''' Link does '''not''' work with thumb, thumbnail or frame. (This works for external and internal links)-->
*: <translate><!--T:45--> '''!''' for MW 1.24 and lower: If you set <code>|link=|</code> (empty), then no <code>title</code> will be rendered. (See [[phabricator:T23454]].)</translate>
* <translate><!--T:46--> Other specific options:</translate>
** <translate><!--T:47--> '''<tvar name=2>alt</tvar>='''''{alternative text}'' &ndash; (<tvar name=1>[[rev:41837|MediaWiki 1.14+]]</tvar>) Defines the alternative text (maps to the HTML attribute <code>alt="..."</code> of the generated <tvar name=3></tvar> element) of an image that will be rendered if either the referenced image cannot be downloaded and embedded, or if the support media must use the alternative description text (e.g. when using a Braille reader or with accessibility options set by the user in its browser).</translate>
*: <translate><!--T:236--> If there is a space character between <tvar name=1><code>alt</code></tvar> and the equals sign, the alt statement will be treated as a caption.</translate>
** '''page='''''{number}'' &ndash; <translate><!--T:48--> Renders the specified page number (currently only applicable when showing a .djvu or .pdf file).</translate>
** '''thumbtime='''''{number}'' &ndash; <translate><!--T:277--> Renders a thumbnail from the video at the specified timestamp in seconds or MM:SS or HH:MM:SS format (only applicable when showing a video file).</translate>
** '''start='''''{number}'' &ndash; <translate><!--T:278--> When video playback is started it will start at the specified timestamp in seconds or MM:SS or HH:MM:SS format (only applicable when showing a video file).</translate>
** '''muted''' &ndash; <translate><!--T:279--> When media playback is started, audio will be muted.</translate>
** '''loop''' &ndash; <translate><!--T:280--> Media will loop continuously. (only applies to audio and video)</translate>
** '''lossy='''''{false}'' &ndash; () <translate><!--T:281--> For using PNG instead of JPG thumbnails for Tiff images</translate>
** '''class='''''{html class}'' &ndash; (MediaWiki 1.20+) <translate><!--T:49--> Defines classes (maps to the HTML attribute <tvar name=3><code>class="..."</code></tvar> of the generated <tvar name=1></tvar> element wrapped around the <tvar name=4></tvar> element).</translate></ref> <translate><!--T:283--> Previously the class was applied directly to the <tvar name=1></tvar> element.</translate><ref> media option is now applied to the wrapper|<translate><!--T:284--> The <tvar name=1>class</tvar> media option is now applied to the wrapper</translate>}}</ref>}}
** '''lang='''''{language code}'' &ndash; (MediaWiki 1.22+) <translate><!--T:50--> For SVG files containing [http://www.w3.org/TR/SVG/struct.html#SwitchElement &lt;switch&gt;] statements varying on a ''systemLanguage'' attribute, selects what language to render the file in.</translate> <translate><!--T:221--> The default is the page language (defaults to project default language on most projects).</translate>

<translate><!--T:51--> If a parameter does not match any of the other possibilities, it is assumed to be the caption text.</translate>
<translate><!--T:237--> If more than one non-parameter string is present, the final non-parameter string will be used as the caption.</translate>
<translate><!--T:52--> Caption text shows below the image in '''thumb''' and '''frame''' formats, or as tooltip text in any other format.</translate>
<translate><!--T:53--> Caption text displayed in the '''thumb''' and '''frame''' formats may contain wiki links and other formatting.</translate>
<translate><!--T:54--> MediaWiki extensions can add additional options.</translate>

<translate>
<!--T:55-->
If 'alt' is not specified and a caption is provided, the alternative text will be created automatically from the caption, stripped of formatting, except when in ''thumb'' or ''frame'' mode since the caption is already readable by screen readers in that case.