Media Picker

The media picker formfield allows you to upload/delete/select files directly from the media-manager. You can customize the behaviour with the following options:

Allowed types

If you want your users to only be able to upload specific file-types you can do so by passing an object with mime-types to the `allowed` prop, for example:

or

Expressions

The base_path and rename can contain the following placeholders:

• {pk} the primary-key of the entry (only for base_path)

• {uid} the user-id of the current logged-in user

• {date:format} the current date in the format defined in format

So a base_path can, for example, look like the following:

Watermark

A watermark can be added to uploaded images. To do so, you need to define a source property relative to Voyagers storage-disk. There are a few optional arguments you can use: position the position where the watermark is placed. Can be:

• top-left (default)

• top

• top-right

• left

x Relative offset to the position on the x-axis. Defaults to 0

y Relative offset to the position on the y-axis. Defaults to 0

size the size (in percent) of the watermark relative to the image. Defaults to 15

Thumbnails

You can generate thumbnails for each uploaded image. A thumbnail can be one of three types:

Fit

Fit combines cropping and resizing to find the best way to generate a thumbnail matching your dimensions. You have to pass width and can pass height and position. An example for fit would be:

Crop

Crop an image by given dimensions and position. You have to pass width and height and can pass x and y. An example for crop would be:

Resize

Resize the image to the given dimensions. You have to pass width and/or height. Some examples for resize:

A watermark can also be inserted into each thumbnail. Just define the on the parent and set watermark to true for each thumbnail you want to insert the watermark to.