---
title: "Image ViewHelper <lim:image>"
manual: "LIA Imageserver"
version: "2.3"
permalink: "https://docs.typo3.org/permalink/lia/lia_imageserver:lia-liaimageserver-image@2.3"
source: "ViewHelpers/LiaImageserver/Image.rst"
modified: "2026-09-16T09:22:57+00:00"
---

# Image ViewHelper `<lim:image>`

This ViewHelper is based on the `f:image` ViewHelper and extends it with some additional attributes.

## Example

```html
<picture>
    <lim:image
        treatIdAsReference="true"
        src="{image.id}"
        alt="{image.alternative}"
        enableWebPSupport="true"
        width="600"
        height="400"
        loading="lazy"
        cropVariant="tablet"
        additionalAttributes="{itemprop: 'test'}"
        imageServerOptions="{fm: 'pjpg', q: 'lossless'}"
        sizes="{
            0: '100vw',
            1: '(min-width: 850px) 350px',
            2: '(min-width: 1024px) calc((100vw - 130px) / 2)'
        }"
        sourceSets="{
            0: {w:320},
            1: {w:350},
            2: {w:490},
            3: {w:1050}
        }"
        passThrough="true"
    />
</picture>
```

You can also use the inline notation.

```html
<picture>
    <f:variable name="sizes" value="{
        0: '100vw',
        1: '(min-width: 850px) 350px',
        2: '(min-width: 1024px) calc((100vw - 130px) / 2)'
    }" />
    <f:variable name="srcSet" value="{0: {w:320}, 1: {w:350}, 2: {w:490}, 3: {w:1050}}" />
    {lim:image(treatIdAsReference: true, src: image.id, alt: image.alternative, width: '600c', height: '400c', cropVariant: 'tablet', imageServerOptions: '{fm: "pjpg", q: "lossless"}', sizes: sizes, sourceSets: srcSet, passThrough: true, loading: 'lazy')}
</picture>
```

**Arguments**

> [!NOTE]
> **Allows arbitrary arguments**
>
> This ViewHelper allows you to pass arbitrary arguments not defined below directly to the HTML tag created. This includes custom `data-` arguments.

The following arguments are available for the image ViewHelper:

-   **absolute**

    -   *Type:* bool
    -   *Default:* false

    Force absolute URL

-   **additionalAttributes**

    -   *Type:* array

    Additional tag attributes. They will be added directly to the resulting HTML tag.

-   **aria**

    -   *Type:* array

    Additional aria-\* attributes. They will each be added with a "aria-" prefix.

-   **base64**

    -   *Type:* bool
    -   *Default:* false

    Return a base64 encoded version of the image

-   **crop**

    -   *Type:* string|bool|array

    overrule cropping of image (setting to FALSE disables the cropping set in FileReference)

-   **cropVariant**

    -   *Type:* string
    -   *Default:* 'default'

    select a cropping variant, in case multiple croppings have been specified or stored in FileReference

-   **data**

    -   *Type:* array

    Additional data-\* attributes. They will each be added with a "data-" prefix.

-   **enableWebPSupport**

    -   *Type:* boolean
    -   *Default:* false

-   **fetchPriority**

    -   *Type:* string

    A string representing the priority hint. Possible values are:. "high", "low" or "auto"

-   **fileExtension**

    -   *Type:* string

    Custom file extension to use

-   **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**

    -   *Type:* object

    image

-   **imageServerOptions**

    -   *Type:* array
    -   *Default:* array (
    )

-   **liaContext**

    -   *Type:* array
    -   *Default:* array (
    )

    Opaque context for ModifyProcessingInstructionsEvent listeners, e.g. {aiBadge: '0'}. Never forwarded to the image server.

-   **loading**

    -   *Type:* string
    -   *Default:* 'lazy'

    Loading attribute (none|eager|lazy)

-   **maxHeight**

    -   *Type:* int

    maximum height of the image

-   **maxWidth**

    -   *Type:* int

    maximum width of the image

-   **minHeight**

    -   *Type:* int

    minimum height of the image

-   **minWidth**

    -   *Type:* int

    minimum width of the image

-   **objectFit**

    -   *Type:* string

-   **objectPosition**

    -   *Type:* string

-   **passThrough**

    -   *Type:* boolean
    -   *Default:* false

-   **respectImageWidth**

    -   *Type:* int
    -   *Default:* 0

    If set source-set definitions will be processed to ensure not to exceed the given image width

-   **respectImageWidthClasses**

    -   *Type:* array
    -   *Default:* array (
      0 => 'staticimage',
      1 => 'u-respect-image-width',
    )

    If respectImageWidh is set, this classes will be applied to the IMG tag

-   **sizes**

    -   *Type:* array
    -   *Default:* array (
    )

-   **sourceSets**

    -   *Type:* array
    -   *Default:* array (
    )

-   **src**

    -   *Type:* string
    -   *Default:* ''

    src

-   **treatIdAsReference**

    -   *Type:* bool
    -   *Default:* false

    given src argument is a sys_file_reference record

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