Variables and reusable templates
Expose only the values that should change, discover their contract and render one or many variants.
A project becomes a template when it publishes typed variables. The visual source remains editable; variables only identify controlled replacement points.
A thousand local variants
One approved layout exposes copy, media and color while keeping the rest of the design fixed.
Declare inputs
{
"variables": [
{ "id": "headline", "label": "Headline", "type": "string", "default": "Now available in Berlin" },
{ "id": "accent", "label": "Accent", "type": "color", "default": "#ff9418ff" },
{ "id": "product", "label": "Product image", "type": "image", "default": "jsoncut-media://media_default" },
{ "id": "showBadge", "label": "Show badge", "type": "boolean", "default": true }
],
"values": {
"headline": "Now available in Hamburg",
"accent": "#6556ffff",
"product": "jsoncut-media://media_hamburg",
"showBadge": true
}
}Bind layers
<h1 data-jc-bind-text="headline">Now available in Berlin</h1>
<img data-jc-bind-src="product" src="jsoncut-media://media_default" alt="" />
<aside data-jc-bind-visible="showBadge">New</aside>
<div data-jc-bind-props="{"background":"accent"}"></div>Supported public variable types are string, number, boolean, color, image, video, audio, sanitized html and a bounded flat string array. Arbitrary objects, enums and nested arrays are intentionally excluded.
Always call GET /api/v2/templates/{id}/inputs before filling a template. The response describes required inputs, examples, numeric constraints and accepted media types. See template rendering and bulk requests for the API workflow.
Binding matrix
| Binding | Compatible variable |
|---|---|
data-jc-bind-text | string or number |
data-jc-bind-src | matching image, video or audio type; string is accepted for compatible source use |
data-jc-bind-html | sanitized html |
data-jc-bind-visible | boolean |
data-jc-repeat | flat string array |
data-jc-bind-props | a supported property mapped to its compatible number, color or boolean variable |
Inside a repeat, item and index may be used as text values. Nested paths such as product.title are not supported. A repeat list contains at most 100 strings and every item is limited to 1000 characters.
Bindable property groups
- geometry: x, y, width, height, rotation and opacity;
- typography: font size, color, background, line height and letter spacing;
- media: trim, speed, volume, fades, mute, loop and object position;
- border: width, color and individual or shared radius;
- filters: blur, brightness, saturation and hue;
- vectors: stroke and stroke width.
Number variables can declare finite min, max, positive step and a short unit. Those constraints are not accepted on non-number variables.
Version-pinned reuse
Publishing captures a project version. Discover the inputs for the exact template version used by a production request. A later project edit does not silently mutate an already published version.