Marketplace / third-party listing tiles

Partnerships runs this when listing on an app marketplace. Each marketplace wants its own tile size. The copy is the same: integration logo, name, category, short blurb. The canvas is not.

This is listing work, done when you go onto a marketplace or when the blurb changes. Cropping one master image five ways will not give you a tile that reads correctly at every size. Each marketplace’s required size has to be a real canvas.

The job is one tile per marketplace, each at that marketplace’s specified size, all sharing the same blurb fields. The logo slot, the name, the category, and the blurb stay in sync. Only meta.dimensions changes per artboard. When the blurb is edited, every marketplace tile has to pick up the edit.

Give Lerret a React component under .lerret/ and optional data. export writes a PNG per artboard. Same component, shared data, many sizes. There is no batch product, no queue, no orchestrator.

The component is .lerret/commerce/marketplace-tile.jsx. It holds an integration logo slot, a name, a category, and a short blurb. You put one artboard per marketplace. Each artboard has its own required tile size in meta.dimensions. The layout can suit that size because dimensions are per-asset.

The data is shared blurb fields via --data. One file applies across the run, so the name and the blurb stay identical on every tile. The many-artboard side is bulk pattern 2: put many artboards in a group, each with its own size, one export captures them all. --data applies to every artboard in the run and is never written back into .lerret/.

The images are PNGs at each marketplace’s specified size.

Per-artboard dimensions covers every marketplace wanting a different size, without cropping one master image five ways. Each artboard is sized for the marketplace it is for, and the blurb is still one set of fields. You change the blurb once and re-export the group.

Point --data at the shared blurb file. One export captures every marketplace artboard. Output is a PNG per artboard, each at that marketplace’s meta.dimensions. --data is never written back into .lerret/, so the default tiles stay clean. Change the blurb, re-run, and the whole set picks it up.

npx @lerret/cli@latest export --data

Start a project with npx create-lerret@latest. More in the use cases index.