Feature request: manual ordering for media folders / collection rows, consumable by loops (image galleries)

[townsendjs]

Version: 0.0.14 · self-hosted, SQLite

Context

I teach web design at the university level, and I'm rebuilding my portfolio on Instatic after years on Squarespace — partly to evaluate it as a classroom alternative to Figma/Framer, since it keeps HTML and CSS as the actual editing surface. Building image galleries is the one place the workflow got noticeably harder than what I was used to.

The gap

For a gallery of 74 images, curation order matters a lot — best work first. There's currently no way to express "these images, in this order."

Concretely:

1. I uploaded images into a Media folder in the sequence I wanted them displayed.
2. Nothing preserved that sequence. media_asset_folders stores only (asset_id, folder_id) — there's no position/sort column, so a manual arrangement has nowhere to live.
3. Bulk uploads all land within a second or two of each other and complete out of order (parallel), so created_at is effectively random inside a batch — it isn't a usable proxy for intent.
4. On the page, <instatic-loop>'s orderBy offers publishedAt, createdAt, updatedAt, slug — none of which is a manual order.

The practical result: to control gallery order I have to encode it into each row's slug (010-, 020-, …) and sort by slug. That works, and it's a fine escape hatch, but for 74 items it means hand-editing 74 slugs — and it overloads the slug (a URL identifier) with presentation meaning.

What would help

Any one of these would solve it:

• A position (or sortOrder) column on collection rows and/or media-folder membership, settable by drag in the Data/Media workspace, and exposed as a loop orderBy option (e.g. orderBy="position").
• Media-folder order as a first-class loop source — "loop this folder, in folder order." This is closest to the mental model I came in with: arrange images in Media, and the page reflects it.

Either way the key part is that the order set in the admin UI is the order the loop renders.

Why it matters beyond my site

This is the single most common thing a student building a portfolio needs: a grid of images in a deliberate order, rearranged by feel, without touching identifiers. It's also the one workflow where Squarespace/Framer currently feel meaningfully easier, which is a shame because everything else about Instatic's model — semantic HTML, real CSS classes, design tokens, clean published output — is much better for teaching.

Note

Everything else in the loop/collection system worked well for this. I populated 74 rows via the MCP connector and had a data-driven gallery grid rendering quickly. Ordering was the only real friction.