4. Asset Management

For a website, images are required in different sizes and formats. For example, teaser need a small image with an aspect ratio of 1:1 in the sidebar and an aspect ratio of 4:3 in the main section. Images in articles and galleries are shown in 5:2 or 4:3 with a large size. And even these sizes are different on mobile devices and desktop displays.

MIME Type Mapping

When building links to image variants in the CAE, the MIME type of the original image is used by default to determine the file extension of the links. To adjust these MIME types you can provide a mapping of original MIME types to desired MIME types in the setting linkMimeTypeMapping. The struct linkMimeTypeMapping contains String properties where the key is the MIME type of the original image and the value is the desired MIME type for the links to variants of this image.

You could for instance add this setting to the Responsive Image Settings content item next to the responsiveImageSettings struct like so:

<Struct xmlns="http://www.coremedia.com/2008/struct">
  <StructProperty Name="linkMimeTypeMapping">
    <Struct>
      <StringProperty Name="image/jpeg">image/png</StringProperty>
      <StringProperty Name="image/gif">image/png</StringProperty>
    </Struct>
  </StructProperty>
  <StructProperty Name="responsiveImageSettings">
    <Struct>
      <StructProperty Name="portrait_ratio1x1">
        ...
      </StructProperty>
      ...
    </Struct>
  </StructProperty>
</Struct>

With these settings all links to variants of images with MIME type image/jpeg or image/gif would be created with MIME type image/png and the file extension .png instead.