How to use Padding
Padding is a real-time effect which is used after importing by changing the image query.
Padding is defined the following way: padding(Left,Top,Right,Bottom)
For this example, we assume the target dimensions of the resulting images are 300×200 pixel (in order to use the images for a product overview site)
Padding could be used in the following way: left and right we define a border of 10px each, while the top and bottom padding will be 50px each.
The (server-side) source image will then be scaled accordingly to fit into the target dimension with the padding.
Please note: The original aspect ratio of the trimmed image needs always be taken into consideration. If the padding values do not respect this aspect ratio, the borders will vary in order to retain the correct ratio. Therefore it is advised to always have the original aspect ratio in mind when using padding, otherwise the values given there will be treated as minimum values.
Padding can be used in the following way: if you use a value between 0-1, e.g. 0.25, it will be treated as a percentage, therefore a padding of 25% will be used. All values above 1 will be treated as a pixel input.