JSON Templates Documentation

JSON Templates is a declarative document templating system built around a JSON format. You design your document visually in the Editor, export it as a template.json file, and render it to HTML or PDF using any compatible engine.

The template file

A template is a plain JSON file that describes the complete structure of a document: its page dimensions, margins, variables, and a tree of layout and content elements.

{
    "$schema": "https://www.jsontemplates.io/schema/v1.json",
    "format": "LETTER",
    "width": 216,
    "height": 279,
    "margins": { "top": 10, "right": 10, "bottom": 10, "left": 10 },
    "variables": {},
    "elements": [...]
}

The elements array holds a tree of layout and content blocks.

Layout

Layouts structure the document by organizing child elements:

Type Description
VerticalLayout Stacks children top to bottom
HorizontalLayout Places children side by side

Layouts can be nested freely to produce any grid structure.

Content blocks

Content blocks are the leaves of the element tree. Each block renders a specific type of content:

Type Description
HtmlBlock Rich text via a WYSIWYG editor
ImageBlock Static or dynamic image
TableBlock Tabular data with configurable columns
ListBlock Dynamic list of items
KeyValueBlock Label-value pairs
BarcodeBlock Linear barcode (e.g. Code128)
QRBlock QR code from any value
PDF417Block High-density 2D barcode

Common element properties

All elements support the following optional properties:

  • padding, margin, border — standard CSS box model values.
  • condition — a expression that controls whether the element is rendered (e.g. "{{ show_logo == true }}").

Template variables

Blocks can reference dynamic values using expressions:

{{ variable }}
{{ variable|default('fallback value') }}
{{ price|number_format(2, '.', ',') }}

Variables and any valid expression are evaluated at render time by the engine. The data context is provided separately from the template file, which keeps templates reusable across different data sets.

Rendering

The template JSON is language-agnostic. To produce output, pass the template and a data context to a renderer:

  • Default engineengine.jsontemplates.io implements the full rendering pipeline using Twig as the default engine.
  • Custom renderer — you can build your own renderer in any language using the rendering API contract.
On this page

Last updated on 06/04/2026 by Anonymous