Transformation functions
Transformation function allows you to serve other version of original images such as thumbnail.
Each transformation function is a series of transformations applied to the image to create a new version. Such as scaling the image or applying a water mark.
Transformation functions replaces predefined setting and offer significant benefits when compared to predefined settings:
- Transformation of images using transformation functions are much faster.
- URL are more predictable and can therefore be constructed directly removing need for caching and additional a roundtrip.
Output format
A transformation function will produce a new image where the type is defined by the output format of the transformation function. The following output formats are supported:
- JPEG
- PNG
- WebP
It is highly recommend to leave the output format to the default WebP.
Supported transformations
The following transformation types are supported.
Resize
Resizes an image to a specified height and width. If only one dimension is specified, the size of the other dimension is automatically calculated from the aspect ratio.
Canvas
Fits an image into a canvas of a specified height and/or width (if only one dimension is specified, the other dimension in the canvas is unlimited) and optionally enlarges the image to fill the canvas in case it's smaller than the canvas. The original aspect ratio is preserved.
Merge
Merges the transformed images with a resource image. For instance adding a watermark to the image. The image is merged in a specified horizontal position (left, center, right), vertical position (top, middle, bottom) and z-position (above, below) in the other image.
Change quality
Sets a quality for the image when exported to e.g. JPEG.
Ensure minimum weight and width
The operation that ensures that the image is at least the given dimensions.
Built in transformation functions
The following transformations are build into the DAM and are always available.
_small-preview
Returns a 350x350 pixel webP image while preserving aspect ratio._medium-preview
Returns a 720x720 pixel webP image while preserving aspect ratio._large-preview
Returns a 2160x3840 pixel webP image while preserving aspect ratio._original
Returns the original file. This works for all file types.
This are used internally in the Bizzkit platform but may also be used by external systems.
How to manage transformation functions
Transformation functions are managed using the Rest API or using the Sdk.
When creating a transformation function the function are given a unique name that are used when referring to the transformation function. It can take a few minutes before a newly created transformation function is fully deployed to all services and transformation with the new function is available.
How to access a transformed image
The URLs for an image can be constructed as follows {cdn-url}/{file-id|cropping-id}/{transformation-id}/{file-name}.{output-extension}
.
Getting the URL of the CDN
The URL to the CDN have been provided to the partner organization, but can also been read in the DAM UI under general information.
In the following the CDN URL is assumed to be https://my-cdn-url.bizzkit.com
.
The URL can also be retrieved by calling the: GET /api/_/settings/cdn
endpoint on the api.
Construction of URLs
Assuming the file my-image.jpg
was uploaded to DAM and given the file id 51216401-481e-4637-bed6-a581cac98e43
by the dam.
A transformation called product-image-large
have been constructed that produces the output type webp
the URL of the transformed image would then be:
https://my-cdn-url.bizzkit.com/51216401-481e-4637-bed6-a581cac98e43/product-image-large/my-image.webp
The original image will be available on:
https://my-cdn-url.bizzkit.com/51216401-481e-4637-bed6-a581cac98e43/_original/my-image.jpg
Notice the change in file extension.
If file name does not match the stored file the CDN will produce a 301 permanent redirect to the correct image. For example the following:
https://my-cdn-url.bizzkit.com/51216401-481e-4637-bed6-a581cac98e43/product-image-large/
https://my-cdn-url.bizzkit.com/51216401-481e-4637-bed6-a581cac98e43/product-image-large/my-image.jpg
Would both result in a permanent redirect to https://my-cdn-url.bizzkit.com/51216401-481e-4637-bed6-a581cac98e43/product-image-large/my-image.webp
Cropping ids can be used in the same way as image ids. If for example a cropping with id 097d9bc0-3715-4139-ac05-112c8b47846c
of the image existed the URL of a scaled version of the cropped image could be: https://my-cdn-url.bizzkit.com/097d9bc0-3715-4139-ac05-112c8b47846c/product-image-large/my-image.webp
Migrating from predefined settings
Note
To avoid generating new images based on predefined settings ensure Cache Automatically
is turned off on all predefined settings.
Your current images may have significant number of incoming links. It is therefore worth noticing that all old URLs to images constructed using predefined settings still works. This allows for a gradual transition to the new CDN.