The <cms:img> tag

This tag supports image scaling using the OpenCms native image scaling mechanism.
Normally, it creates a HTML <img> tag with the appropriate attributes and the parametrized URL for the scaled image.

Attributes:

Name Description Required
src Specifies the image to scale yes
width This value defines the desired width of the image no
height This value defines the desired height of the image no
scaleType This value specifies how the image is enlarged and/or reduced in order to match the desired dimensions:
  • 0: Scale to exact target size with background padding (default)
    • enlarge image to fit in target size (if required)    
    • reduce image to fit in target size (if required)
    • keep image aspect ratio
    • fill up with bgcolor to reach exact target size
    • fit full image inside target size (only applies if reduced)
  • 1: Create a thumbnail for the image
    • don't enlarge the image
    • reduce image to fit in target size (if required)
    • keep image aspect ratio
    • fill up with bgcolor to reach exact target size
    • fit full image inside target size (only applies if reduced)
  • 2: Scale to exact target size, crop what does not fit
    • enlarge image to fit in target size (if required)
    • reduce image to fit in target size (if required)
    • keep image aspect ratio
    • fit full image inside target size (crop what does not fit)
  • 3: Scale and keep image proportions, target size variable
    • enlarge image to fit in target size (if required)
    • reduce image to fit in target size (if required)
    • keep image aspect ratio
    • scaled image will not be padded or cropped,
      so target size may be not the requested size
  • 4: Don't keep image propotions, use exact target size
    • enlarge image to fit in target size (if required)
    • reduce image to fit in target size (if required)
    • don't keep image aspect ratio
    • the image will be scaled exactly to the given target size
no
scalePosition

This value controls the padding of the image inside the desired dimensions, if a scale type keeping the aspect ratio was selected:

  • 0: center (default)
  • 1: lower left
  • 2: lower right
  • 3: lower middle
  • 4: left middle
  • 5: right middle
  • 6: upper middle
  • 7: upper left
  • 8: upper right
no
scaleFilter This value specifies one or more filters which are applied to the image.
When specifying more than one filter, the filter names are separated with a colon ":".
Available filters are:
  • grayscale: Renders the image in grayscale
  • shadow: Renders the image with a shadow around
no
scaleQuality This value specifies the image qualilty (JPEG only) no
scaleColor This value specifies the background color used for padding no
scaleRendermode This value specifies the rendering quality:
  • 0: Use best possible image processing - this may be slow sometimes (default)
  • 1: Use default rendering hints from JVM - not recommended since it's almost as slow as the default
  • 2: Fastest image processing but worse results - use this for thumbnails or where speed is more important then quality
no
partialTag If set to true, only the attributes src/width/height of the HTML image tag are generated, not the tag.
Otherwise, a full image tag like <img src="..." width="..." height="..."/> is generated.
no

Body:

This tag has no body content!

Example usage:

Renders the image that it fits into a square of 400x400. A shadow will be added around the image and all this will be placed in the center of the square:

<cms:img src="logo_opencms.gif" scaleFilter="shadow" width="400" height="400"/>

The test example demonstrates the effects of the various attribute settings.