uri.image ViewHelper <f:uri.image>

Resizes a given image (if required) and returns its relative path.

External URLs are not processed and just returned as is.

Examples

Default

<f:uri.image src="EXT:myext/Resources/Public/typo3_logo.png" />
Copied!

Results in the following output within TYPO3 frontend:

typo3conf/ext/myext/Resources/Public/typo3_logo.png

and the following output inside TYPO3 backend:

../typo3conf/ext/myext/Resources/Public/typo3_logo.png

Image Object

<f:uri.image image="{imageObject}" />
Copied!

Results in the following output within TYPO3 frontend:

fileadmin/images/image.png

and the following output inside TYPO3 backend:

fileadmin/images/image.png

Inline notation

{f:uri.image(src: 'EXT:myext/Resources/Public/typo3_logo.png', minWidth: 30, maxWidth: 40)}
Copied!

typo3temp/assets/images/[b4c0e7ed5c].png

Depending on your TYPO3s encryption key.

Non existing image

<f:uri.image src="NonExistingImage.png" />
Copied!

Could not get image resource for "NonExistingImage.png".

Arguments

src

DataType
string
Required
false
Description
Src

treatIdAsReference

DataType
mixed
Required
false
Description
Given src argument is a sys_file_reference record

image

DataType
mixed
Required
false
Description
Image

crop

DataType
mixed
Required
false
Description
Overrule cropping of image (setting to FALSE disables the cropping set in FileReference)

cropVariant

DataType
string
Default
'default'
Required
false
Description
Select a cropping variant, in case multiple croppings have been specified or stored in FileReference

fileExtension

DataType
string
Required
false
Description
Custom file extension to use

width

DataType
string
Required
false
Description
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

DataType
string
Required
false
Description
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.

minWidth

DataType
mixed
Required
false
Description
Minimum width of the image

minHeight

DataType
mixed
Required
false
Description
Minimum height of the image

maxWidth

DataType
mixed
Required
false
Description
Maximum width of the image

maxHeight

DataType
mixed
Required
false
Description
Maximum height of the image

absolute

DataType
mixed
Required
false
Description
Force absolute URL