Uri.image ViewHelper <f:uri.image>

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

This ViewHelper should only be used for images within FAL storages, or where graphical operations shall be performed.

Note that when the contents of a non-FAL image are changed, an image may not show updated processed contents unless either the FAL record is updated/removed, or the temporary processed images are cleared.

Also note that image operations (cropping, scaling, converting) on non-FAL files may be changed in future TYPO3 versions, since those operations are coupled with FAL metadata. Each non-FAL image operation creates a "fake" FAL record, which may lead to problems.

For extension resource files, use <f:uri.resource> instead.

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".

Base 64

When the base64 argument is set to true, this ViewHelper returns a base 64 encoded version of the ressource.

<img src="{f:uri.image(base64: 'true',
                       src:'EXT:backend/Resources/Public/Images/typo3_logo_orange.svg')}">
Copied!

Will return the image encoded in base64:

<img src="data:image/svg+xml;base64,PHN2...cuODQ4LTYuNzU3Ii8+Cjwvc3ZnPgo=">
Copied!

This can be particularly useful inside FluidEmail or to prevent unneeded HTTP calls.

Source code

Go to the source code of this ViewHelper: Uri\ImageViewHelper.php (GitHub).

Arguments

The following arguments are available for the uri.image ViewHelper:

absolute

absolute
Type
bool
Default
false
Force absolute URL

base64

base64
Type
bool
Default
false
Return a base64 encoded version of the image

crop

crop
Type
string|bool|array
overrule cropping of image (setting to FALSE disables the cropping set in FileReference)

cropVariant

cropVariant
Type
string
Default
'default'
select a cropping variant, in case multiple croppings have been specified or stored in FileReference

fileExtension

fileExtension
Type
string
Custom file extension to use

height

height
Type
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.

image

image
Type
object
image

maxHeight

maxHeight
Type
int
maximum height of the image

maxWidth

maxWidth
Type
int
maximum width of the image

minHeight

minHeight
Type
int
minimum height of the image

minWidth

minWidth
Type
int
minimum width of the image

src

src
Type
string
Default
''
src

treatIdAsReference

treatIdAsReference
Type
bool
Default
false
given src argument is a sys_file_reference record

width

width
Type
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.