≡

Package

ViewHelpers

ViewHelper Documentation

v:media.image

Renders an image tag for the given resource including all valid HTML5 attributes. Derivates of the original image are rendered if the provided (optional) dimensions differ.

rendering responsive Images variants

You can use the srcset argument to generate several differently sized versions of this image that will be added as a srcset argument to the img tag. enter a list of widths in the srcset to genereate copies of the same crop + ratio but in the specified widths. Put the width at the start that you want to use as a fallback to be shown when no srcset functionality is supported.

Example

<v:media.image src="fileadmin/some-image.png" srcset="480,768,992,1200" />

Browser Support

To have the widest Browser-Support you should consider using a polyfill like: http://scottjehl.github.io/picturefill

Arguments

src anySimpleType

Path to the media resource(s). Can contain single or multiple paths for videos/audio (either CSV, array or implementing Traversable).

relative boolean

If FALSE media URIs are rendered absolute. URIs in backend mode are always absolute.

width string

Width of the image. This can be a numeric value representing the fixed width of the image in pixels. But you can also perform simple calculations by adding "m" or "c" to the value. See imgResource.width for possible options.

height string

Height of the image. This can be a numeric value representing the fixed height of the image in pixels. But you can also perform simple calculations by adding "m" or "c" to the value. See imgResource.width for possible options.

maxW integer

Maximum Width of the image. (no upscaling)

maxH integer

Maximum Height of the image. (no upscaling)

minW integer

Minimum Width of the image.

minH integer

Minimum Height of the image.

format string

Format of the processed file - also determines the target file format. If blank, TYPO3/IM/GM default is taken into account.

quality integer

Quality of the processed image. If blank/not present falls back to the default quality defined in install tool.

treatIdAsReference boolean

When TRUE treat given src argument as sys_file_reference record. Applies only to TYPO3 6.x and above.

canvasWidth integer

Width of an optional canvas to place the image on.

canvasHeight integer

Height of an optional canvas to place the image on.

canvasColor string

Background color of an optional canvas to place the image on (hex triplet).

crop string

Information generated by the backend's graphical cropping UI

class string

CSS class(es) for this element

dir string

Text direction for this HTML element. Allowed strings: "ltr" (left to right), "rtl" (right to left)

id string

Unique (in this file) identifier for this HTML element.

lang string

Language for this element. Use short names specified in RFC 1766

style string

Individual CSS styles for this element

title string

Tooltip text of element

accesskey string

Keyboard shortcut to access this element

tabindex integer

Specifies the tab order of this element

onclick string

JavaScript evaluated for the onclick event

usemap string

A hash-name reference to a map element with which to associate the image.

ismap string

Specifies that its img element provides access to a server-side image map.

alt string

Equivalent content for those who cannot process images or who have image loading disabled.

srcset anySimpleType

List of width used for the srcset variants (either CSV, array or implementing Traversable)

srcsetDefault integer

Default width to use as a fallback for browsers that don't support srcset

ViewHelper Resources

Schema Resources