Documentation · ViewHelper reference

ImageViewHelper


Resizes a given image (if required) and renders the respective img tag

Examples

Default

<f:image src="EXT:myext/Resources/Public/typo3_logo.png" alt="alt text" />

Output

alt text
or (in BE mode): alt text

Image Object

<f:image image="{imageObject}" />

Output

alt set in image record

Inline notation

{f:image(src: 'EXT:viewhelpertest/Resources/Public/typo3_logo.png', alt: 'alt text', minWidth: 30, maxWidth: 40)}

Output

alt text
(depending on your TYPO3s encryption key)

non existing image

<f:image src="NonExistingImage.png" alt="foo" />

Output

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

/
  • Tag usage example

    <f:image additionalAttributes="{foo: 'bar'}" data="{foo: 'bar'}" src="NULL" width="NULL" height="NULL" minWidth="123" minHeight="123" maxWidth="123" maxHeight="123" treatIdAsReference="1" image="[anySimpleType]" crop="[anySimpleType]" absolute="1" class="NULL" dir="NULL" id="NULL" lang="NULL" style="NULL" title="NULL" accesskey="NULL" tabindex="123" onclick="NULL" alt="NULL" ismap="NULL" longdesc="NULL" usemap="NULL">
    	<!-- tag content - may be ignored! -->
    </f:image>
  • Inline usage example

    {f:image(additionalAttributes: {foo: 'bar'}, data: {foo: 'bar'}, src: 'NULL', width: 'NULL', height: 'NULL', minWidth: 123, minHeight: 123, maxWidth: 123, maxHeight: 123, treatIdAsReference: 1, image: [anySimpleType], crop: [anySimpleType], absolute: 1, class: 'NULL', dir: 'NULL', id: 'NULL', lang: 'NULL', style: 'NULL', title: 'NULL', accesskey: 'NULL', tabindex: 123, onclick: 'NULL', alt: 'NULL', ismap: 'NULL', longdesc: 'NULL', usemap: 'NULL')}

Arguments

Argument Description Type
absolute

Force absolute URL

boolean
accesskey

Keyboard shortcut to access this element

string
additionalAttributes

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

array
alt

Specifies an alternate text for an image

string
class

CSS class(es) for this element

string
crop

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

anySimpleType
data

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

array
dir

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

string
height

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.

string
id

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

string
image

a FAL object

anySimpleType
ismap

Specifies an image as a server-side image-map. Rarely used. Look at usemap instead

string
lang

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

string
longdesc

Specifies the URL to a document that contains a long description of an image

string
maxHeight

maximum height of the image

integer
maxWidth

maximum width of the image

integer
minHeight

minimum height of the image

integer
minWidth

minimum width of the image

integer
onclick

JavaScript evaluated for the onclick event

string
src

a path to a file, a combined FAL identifier or an uid (int). If $treatIdAsReference is set, the integer is considered the uid of the sysfilereference record. If you already got a FAL object, consider using the $image parameter instead

string
style

Individual CSS styles for this element

string
tabindex

Specifies the tab order of this element

integer
title

Tooltip text of element

string
treatIdAsReference

given src argument is a sysfilereference record

boolean
usemap

Specifies an image as a client-side image-map

string
width

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.

string
Required attribute

Revision history

commit 38ebcedd944471b83d9293b648264fd3e65634f1
Author: Bastian Waidelich <*****@typo3.org>
Date:   Tue May 5 20:52:33 2009 +0000

    Fluid:
    * Changes backported from FLOW3:
      * major cleanup and refactoring of core and view helper classes & comments
      * added validation for boolean arguments in AbstractViewHelper
      * added initialize-method to AbstractViewHelper, that is called before render(). This was especially needed for tagbased viewhelpers.
      * renderChildren() now directly calls evaluateChildNodes() on the respective view helper node allowing us to render objects/arrays.
      * improved boolean type conversion for arguments in ViewHelperNode.
      * added TagBuilder class, re-wrote all tag based view helpers to use it (see form view helpers for some examples)
      * ViewHelperArguments collection got a new method "hasArgument()" that returns TRUE when the specified argument exists and is not NULL
    * tx_fluid changes:
      * Improved fake object factory. Now objects are injected to subclasses and implementations of the specified classes/interfaces.
      * cleaned up and tweaked view helpers. Removed Parsefunc, Stdwrap and TypoScript view helpers for now. Added CObject, If/Then/Else, EmailLink, Crop, Currency, Debug, HTML, Nl2br, Image view helpers. Thanks to Sebastian Böttger, Christopher Hlubek, Niels Pardon, Andreas Pattynama for the help!
    * Note: Unit tests not fully backported yet.

commit 50af6b9c08d04e3e1d4ce56a499a9a3d4b84efc3
Author: Sebastian Kurfürst <*****@typo3.org>
Date:   Thu May 28 21:45:46 2009 +0000

    Fluid:
    * Backported major changes from Fluid v5 to Fluid v4
    * !!! Many of these changes are not backwards-compatible! Please read this if you have written custom ViewHelpers!
    * Introduced Shorthand Syntax for calling ViewHelpers
    * Core:
    ** Lots of internal cleanup and refactorings.
    ** !!! Complete restructuring into subpackages.
    * ViewHelpers:
    ** !!! The base classes of ViewHelpers changed to Tx_Fluid_Core_ViewHelper_AbstractViewHelper and Tx_Fluid_Core_ViewHelper_TagBasedViewHelper. Please adjust your ViewHelpers!
    ** !!! $this->variableContainer has been renamed to $this->templateVariableContainer
    ** !!! the view is not in $this->variableContainer anymore. Currently there is no way to fetch the View from a ViewHelper.
    ** Introduced a new $this->controllerContext containing the context variables of the controller
    ** !!! The request can be now found in $this->controllerContext->getRequest()
    ** !!! The URIHelper has been renamed to URIBuilder and can be now found in $this->controllerContext->getURIBuilder()
    ** Introduced a new ViewHelperVariableContainer, available in $this->viewHelperVariableContainer to pass data between ViewHelpers. Should only be needed in very rare cases.
    ** !!! Removed <f:format.htmlEscape> ViewHelper! Please remove these declarations in your template! Escaping of object accessors is now automatically done, see next point.
    * !!! ObjectAccessors {...} are now automatically HTMLspecialChar'd if not used as an argument to a ViewHelper. This is done using a new ObjectAccessorPostProcessor. Lateron, this will be made configurable.

commit 94baa46997eb185ce80e004daa9ca35c4a8d3600
Author: Bastian Waidelich <*****@typo3.org>
Date:   Mon Jun 15 12:03:04 2009 +0000

    tx_fluid: (fresh backport from Fluid Package r2609 with FluidBackporter r2611):
      [FIX] Fluid (Core): Set controller context only if not null. This needs to be done for rendering contexts without a controller context  (e.g. in a service)
      [TASK] Fluid (Core): Fixed a few doc comments
      [TASK] Fluid (Core): Removed commented-out code as it was obsolete
    
    other changes in tx_fluid:
      * AbstractFormViewHelper: Removed persistenceManager-dependency. getName() and getValue() now return correct values for domain objects. Resolves #3651
      * Adjusted doc comments of ImageViewHelper. Resolves #3394
      * Fixed a few more doc comments

commit 3197b416216c8888cfa4eab9aae67d4b89e74726
Author: Bastian Waidelich <*****@typo3.org>
Date:   Sun Aug 9 19:41:01 2009 +0000

    [~BUGFIX] Fluid (ViewHelpers): Replaced usage of $GLOBALS['TSFE']->cObj by t3lib_div::makeInstance('tslib_cObj') in CObjectViewHelper, HtmlViewHelper and ImageViewHelper. Note: In CropViewHelper & EmailViewHelper it does no harm to use $GLOBALS['TSFE']->cObj. Thanks for the patch. Resolves #4063.

commit a737739af5637ab6b5a19cfd7eb41d646b4c020c
Author: Bastian Waidelich <*****@typo3.org>
Date:   Thu Sep 17 12:44:23 2009 +0000

    [+FEATURE] Fluid (Viewhelpers): Added backend mode support for view helpers base, cObject, format.crop (partly), link.email, translate (partly), uri.email. Now only image- and renderFlashMessages view helpers are not working in BE

commit 186bdaeac89820779f91853b830cc95d60c7ad58
Author: Bastian Waidelich <*****@typo3.org>
Date:   Tue Jul 13 09:42:26 2010 +0000

    [-TASK] Fluid: R*****@version annotation from all Fluid classes to ease the backporting process. Relates to #8835 (backported from Fluid package)

commit 1d36de6ed90007e324b773782e8f0a1d1c1191a2
Author: Bastian Waidelich <*****@typo3.org>
Date:   Tue Jul 13 10:12:30 2010 +0000

    [-TASK] Fluid: R*****@package/@subpackage annotations from all Fluid classes. They have already been removed in FLOW3 packages in r2813.

commit 2bd9f56a7a820e303cc9ad9900557edb677136a8
Author: Bastian Waidelich <*****@typo3.org>
Date:   Tue Jul 13 14:17:07 2010 +0000

    [+BUGFIX] Fluid: Replaced SplObjectStorage by Tx_Extbase_Persistence_ObjectStorage to be PHP 5.2-compatible (which ships with a broken implementation of SplObjectStorage)
    [!!!][~TASK] Fluid (Core): Renamed ConditionViewHelper and TagBasedViewHelper to Abstract*ViewHelper as per CGL. (backported from Fluid package r4840). To be backwards-compatible, TagBasedViewHelper.php still exists and will write an entry to TYPO3s deprecation log if used. Please adapt your custom ViewHelpers and inherit from AbstractTagBasedViewHelper instead of TagBasedViewHelper. This resolves #8834
    [~TASK] Fluid: Marked vfs unit tests to be skipped, as vfs is not part of v4 (yet)

commit 7c4adb435f5739a8574b3c28d79993ec1cae4270
Author: Bastian Waidelich <*****@typo3.org>
Date:   Mon Jul 19 18:09:46 2010 +0000

    [~TASK] Fluid (ViewHelpers): Fixed BE support of the ViewHelpers cObject, format.crop, uri.resource. Relates to #8947
    [~TASK] Fluid (ViewHelpers): Added BE support in the ViewHelpers format.html and image. Relates to #8947

commit cd224a63abd350a2a3137c4087508d4de94faeeb
Author: Bastian Waidelich <*****@typo3.org>
Date:   Thu Oct 14 11:01:57 2010 +0000

    [+BUGFIX] Fluid (ViewHelpers): ImageViewHelper supports additionalAttributes argument
    
    The image view helper did not call the parent constructor, which registeres the "additionalAttributes" argument. Thanks to Michael Knoll.
    
    This resolves #10251

commit 5c8c4d6012158d52bf1618cb25ef066d9f639f31
Author: Bastian Waidelich <*****@typo3.org>
Date:   Sun Nov 14 13:38:48 2010 +0000

    [+FEATURE] Fluid (Core/Widget): Added Tx_Fluid_Core_Widget_Bootstrap that is used to dispatch Ajax requests (see ext_typoscript_setup.txt).
    [~TASK] Fluid (Compatibility): Removed Tx_Fluid_Compatibility_ObjectManager and replaced instances by Tx_Extbase_Object_ObjectManagerInterface instances
    [~TASK] Fluid (Core/Widget): AbstractWidgetController has to be a singleton so it can be injected in the WidgetViewHelper.. To be discussed!
    [+TASK] Fluid (Core/Widget): AjaxWidgetContextHolder is now correctly stored in the BE/FE Users session if the ajaxWidget of the corresponding Widget is TRUE.
    [+TASK] Fluid (Core/Widget): The WidgetContext now contains a reference to the parent extension & plugin name. That's needed for the widgetAjaxResponse.
    [+BUGFIX] Fluid (Core/Widget): WidgetRequestBuilder now correctly interprets GET parameters and dispatches Ajax requests
    [+BUGFIX] Fluid (ViewHelpers): Modified ViewHelpers cObject, format.crop, format.html, image, uri.image so that they use dependency injection in order to retrieve the current cObject instance from the configurationManager
    [+BUGFIX] Fluid (ViewHelpers): Fixed form ViewHelper to respect configured pluginNamespace in field name prefixes
    [+BUGFIX] Fluid (ViewHelpers): link.widget/uri.widget ViewHelpers now create correct URIs
    [+BUGFIX] Fluid (ViewHelpers):*****@inject annotation by injectController method in AutocompleteViewHelper.

commit c98945130824aebbdef271d7244aec8cd29c794e
Author: Bastian Waidelich <*****@typo3.org>
Date:   Tue Nov 16 23:49:43 2010 +0000

    [+BUGFIX] Fluid (ViewHelpers): replaced two occurrences of Tx_Extbase_Dispatcher::*() by using the injected ConfigurationManager
    [+TASK] Fluid (ViewHelpers): uri.image now works in BE mode too

commit dd8928aed4c119d8db37322acb91ded24ba5cc35
Author: Bastian Waidelich <*****@typo3.org>
Date:   Thu Dec 30 16:21:11 2010 +0000

    [+TASK] Fluid (ViewHelpers): Fix, cleanup and extend inline documentation of ViewHelpers
    
    Resolves #10908

commit fd09d197fa8886b97cb20aa9573f39cd08ce989e
Author: Bastian Waidelich <*****@typo3.org>
Date:   Thu Nov 10 18:27:58 2011 +0100

    [TASK] S*****@author annotations
    
    This backports three recent changes of the TYPO3.Fluid package:
    - R*****@license annotation from files (290f4f5)
    - Simplify license header in PHP files (14bacba)
    - D*****@author tags from source code (9c2e837)
    
    This should not contain any functional change!
    
    Change-Id: I9376dca4af78c4f0f82413011d115b8ad04634dd

commit ec3891d8d4e339d8319428211207e6201be9fd73
Author: Thomas Maroschik <*****@dfau.de>
Date:   Wed Oct 17 21:18:26 2012 +0200

    [TASK][WIP] Move non class code back to source files
    
    Change-Id: I620d2e61860142cdc89cc83474c95542799961c0

commit 554e8f890dcc0dd86a27518b58e2b54be26fd37e
Author: Thomas Maroschik <*****@dfau.de>
Date:   Wed Oct 17 22:20:17 2012 +0200

    [TASK] Namespace classes
    
    Change-Id: Ia7432e1c923826ed58206bca15fb94509adbd508

commit 547ef7f60f39c6bfcb0376e5e76070da85860098
Author: Arvid Jakobsson <*****@gmail.com>
Date:   Mon Sep 17 21:25:51 2012 +0200

    [TASK] Remove superfluous parenthesis in sysexts
    
    Superfluous brackets in fluid after namespaces move
    Change ("a" . "b") . "c" into "a" . "b" . "c" using the lex-pass tool.
    
    Resolves: #41016
    Related: #40095
    Releases: 6.0
    Change-Id: I64741473cb24eda343f0576ebd1a0f1846dfc3f8
    Reviewed-on: http://review.typo3.org/14675
    Reviewed-by: Oliver Hader
    Tested-by: Oliver Hader

commit a6e32820129b9a41e295b53367f8fdcd52e6cd51
Author: dkd-egerer Sascha Egerer <*****@dkd.de>
Date:   Fri Apr 13 16:32:17 2012 +0200

    [BUGFIX] Always add the "alt" attribute for images
    
    The ImageViewHelper does not add the alt-attribute to the
    image tag if it is not set. This patch renders always the
    alt attribute to the img-tag even if it is empty.
    
    Change-Id: I2d69e9cdba428771659f4afc8814ec8eb02d6090
    Fixes: #9151
    Releases: 6.0, 4.7, 1.3
    Reviewed-on: http://review.typo3.org/10426
    Reviewed-by: Tilo Baller
    Tested-by: Tilo Baller
    Reviewed-by: Mattias Nilsson
    Tested-by: Mattias Nilsson
    Reviewed-by: Ingo Pfennigstorf
    Tested-by: Ingo Pfennigstorf
    Reviewed-by: Alexander Schnitzler
    Tested-by: Alexander Schnitzler

commit 9d46e6932d35c79bf87c96fa38b8e537c4192f23
Author: Alexander Schnitzler <*****@typovision.de>
Date:   Tue Nov 20 16:27:02 2012 +0100

    [CLEANUP] Adjust code to CGL and fix small namespace bugs
    
    * whitespaces, tabs and blank line issues
    * bool -> boolean
    * int -> integer
    * fix wrong namespace annotations
    
    Fixes: #43157
    Releases: 6.0
    Change-Id: I8397948e19248db029d8efd1555ee56e4982742d
    Reviewed-on: http://review.typo3.org/16619
    Reviewed-by: Helmut Hummel
    Tested-by: Helmut Hummel

commit d0867f6f90d3e518cb696fda161a5c6fa936ab03
Author: Stefan Froemken <*****@gmail.com>
Date:   Fri Nov 30 21:41:59 2012 +0100

    [BUGFIX] Image viewhelper clears $GLOBALS['TSFE'] in backend context
    
    The image viewhelper replaces the $GLOBALS['TSFE'] array to
    simulateFrontendEnvironment if it is called in backend context.
    After successful get of the image, it restores the TSFE.
    
    But in case, that the requested image has not been found,
    it throws an Tx_Fluid_Core_ViewHelper_Exception, which means
    that the TSFE get not restored. This causes errors when other
    code tries to access TSFE after the image viewhelper has been
    executed.
    
    Resolves: #43446
    Releases: 4.5, 4.6, 4.7, 6.0
    
    Change-Id: Ic5b1fc73c74ffa7fca6e36c6f42e3f2084efa7c8
    Reviewed-on: http://review.typo3.org/16933
    Reviewed-by: Georg Ringer
    Tested-by: Georg Ringer

commit 69543ba66eaad92e821f26f5e37e9191283cbf30
Author: Anja Leichsenring <*****@ab-softlab.de>
Date:   Thu Dec 13 16:31:35 2012 +0100

    [BUGFIX] Add needed setting to handle file_references correctly
    
    The ImageViewHelper needs the setting 'treatIdAsReference' to
    handle file_references correctly.
    
    Change-Id: I4aa8ea8e50147a7f3b8d4b5695b6d37bd4ce501f
    Fixes: #43964
    Releases: 6.0, 6.1
    Reviewed-on: https://review.typo3.org/17152
    Reviewed-by: Sebastian Michaelsen
    Reviewed-by: Stefan Neufeind
    Tested-by: Stefan Neufeind
    Reviewed-by: Wouter Wolters
    Tested-by: Wouter Wolters

commit fae04a024687fd061c41d67076cfb455d189aefc
Author: Christian Kuhn <*****@schwarzbu.ch>
Date:   Wed May 1 17:57:52 2013 +0200

    [BUGFIX] Mentions of old class names
    
    Change-Id: Iee7a863a9d68d1379e1e616414b9848e0c535a8a
    Resolves: #47791
    Releases: 6.2
    Reviewed-on: https://review.typo3.org/20378
    Reviewed-by: Christian Kuhn
    Tested-by: Christian Kuhn

commit 37881ea34b09dac8bf94e488e821a18c9fbf29d5
Author: Daniel Hürtgen <*****@rheinschafe.de>
Date:   Tue Apr 30 09:45:28 2013 +0200

    [FEATURE] ImageViewHelper removed title fallback onto alt tag
    
    Currently the title tag is customizable but, if not set, the value
    of the alt tag will be used. But sometimes you don't want to render
    a title tag.
    
    This patch removes the fallback onto the alt tag value and make the
    title tag optional.
    
    Releases: 6.2
    Resolves: #47552
    Change-Id: I7a2415422be3da2b9f81c7e29a4e96507a1ad69e
    Reviewed-on: https://review.typo3.org/20347
    Reviewed-by: Stefan Froemken
    Tested-by: Stefan Froemken
    Reviewed-by: Daniel Hürtgen
    Tested-by: Daniel Hürtgen

commit 77f29a3c69a7cbb27b34072754aa503bace6c9f1
Author: Christian Kuhn <*****@schwarzbu.ch>
Date:   Tue Oct 1 14:40:56 2013 +0200

    [TASK] Remove closing PHP tags
    
    Change-Id: Iaa92566c53301e49396fc9fb26b0b339c48d567b
    Resolves: #52360
    Releases: 6.2
    Reviewed-on: https://review.typo3.org/24212
    Reviewed-by: Christian Kuhn
    Tested-by: Christian Kuhn
    Reviewed-by: Ernesto Baschny
    Tested-by: Ernesto Baschny
    Reviewed-by: Anja Leichsenring
    Tested-by: Anja Leichsenring

commit 3d976ac9f24159e1a7cb6e6894de66e44b1b43fc
Author: Helmut Hummel <*****@typo3.org>
Date:   Sun Oct 20 18:38:47 2013 +0200

    [TASK] Rework image viewHelper to use FAL
    
    Currently in the worst case images are transformed
    from Extbase domain objects to FAL objects to paths
    to FAL objects again just to render an image.
    
    Avoid back and forth conversions an directly use
    FAL API instead of using the detour through
    the content object renderer.
    
    Resolves: #53700
    Releases: 6.2
    Change-Id: I5fe8d7c9d4ad94e99b5bac06e54ff1346e8cc187
    Reviewed-on: https://review.typo3.org/24911
    Reviewed-by: Markus Klein
    Tested-by: Markus Klein
    Reviewed-by: Jigal van Hemert
    Tested-by: Jigal van Hemert

commit 81202b0a35c041ea25ed7bc81a94542972597048
Author: Ernesto Baschny <*****@cron-it.de>
Date:   Thu Jan 9 13:52:37 2014 +0100

    [BUGFIX] Images in distributions are not shown
    
    The API of the fluid image viewhelper had changed. This makes that
    change less breaking, by respecting the old order of parameters,
    thus allowing subclasses to continue working as usual.
    
    Also adds some comments in phpdoc for the parameters.
    
    Related: #53700
    Resolves: #54411
    Releases: 6.2
    
    Change-Id: I11c8ec06ee263a18abd72a12e77a25899f73b475
    Reviewed-on: https://review.typo3.org/26407
    Reviewed-by: Helmut Hummel
    Tested-by: Helmut Hummel
    Reviewed-by: Philipp Gampe
    Reviewed-by: Stefan Neufeind
    Tested-by: Stefan Neufeind

commit de63e404b1f03780af92c337efda747a3233e4ce
Author: Przemysław Krukowski <*****@sourcebroker.net>
Date:   Sat Feb 8 15:40:58 2014 +0100

    [BUGFIX] Duplicate exception code
    
    Exception codes are unique now.
    
    Resolves: #52294
    Releases: 6.2
    Change-Id: I4ad49b1ff0342ea36147b6ba0b01d270d9d9f3c5
    Reviewed-on: https://review.typo3.org/27462
    Reviewed-by: Christian Kuhn
    Tested-by: Christian Kuhn
    Reviewed-by: Anja Leichsenring
    Tested-by: Anja Leichsenring