Gallery Field (PRO)

Many files in one field, ordered by dragging. Each gets its own title, description and group, and is edited separately.

Settings: source and file path as for a file, the filename strategy as for an image, plus two of its own:

Setting	What it does
File groups	Named groups, so one gallery can feed several places on the page
Thumbnails	Sizes to generate, described as JSON

A thumbnail description looks like this:

{"webp": {"w": 120, "h": 90, "q": 90, "zc": "1", "bg": "000000", "f": "webp"}}

That makes 120×90 thumbnails in WebP, in a webp folder beside the originals.

Output is an array; each item carries the same keys a file does, plus type, preview and groups:

<div class="gallery">
    {foreach $images as $image}
        {if $image.type === 'image'}
            <img src="/{$image.url}" alt="{$image.title ?: $image.name}">
        {/if}
    {/foreach}
</div>

A gallery holds any files, not only pictures

A video, a PDF and a photograph can live side by side; type tells them apart, and a video can be given a poster of its own. That is what makes branching on type in the loop worth the trouble.

Rows live in their own table, and that has consequences

Files are stored separately from the record, not inside its value. Hence "required" is hidden for this type — there is nothing on the record to check — and a gallery is skipped when resource and user section values are saved.