Templates

Templates are collections of pages that compose blocks into complete websites. They're pure manifests — no component code, just configuration.

Last updated: January 15, 2026

What is a Template?

A template defines a multi-page site by combining blocks with content. Unlike blocks, templates have no React component. They consist of:

  • pages.json — defines all pages, their blocks, and content
  • block.config.ts — template metadata and global settings schema
  • package.json — dependencies and template info

pages.json Structure

The pages.json file is the heart of a template. It defines layout positions (header, footer) and individual pages with their blocks:

Layout Positions

Layout positions are blocks that appear on every page. The most common are:

  • header — site navigation, rendered at the top
  • footer — site footer, rendered at the bottom
  • sidebar_left — documentation sidebar

Each layout position specifies a block type and its content. This content is shared across all pages.

Publishing Templates

When you publish a template, the CLI:

  1. Publishes all referenced blocks that have changed
  2. Creates or updates all pages defined in pages.json
  3. Sets up layout positions (header, footer)

Templates don't have source code to compile — they're pure configuration. This makes publishing fast and reliable.

Dev Preview

Run cmssy dev and click on a template to see a full composed preview. The dev server renders all blocks on each page with a navigation bar to switch between pages. Use Ctrl+K to quickly jump to any page.

pages.json
1{
2  "layoutPositions": {
3    "header": {
4      "type": "@cmssy-marketing/blocks.header",
5      "content": {
6        "logoText": "cmssy",
7        "navigation": [
8          { "label": "Features", "url": "/features" },
9          { "label": "Pricing", "url": "/pricing" }
10        ]
11      }
12    },
13    "footer": {
14      "type": "@cmssy-marketing/blocks.footer",
15      "content": { "copyrightText": "cmssy. All rights reserved." }
16    }
17  },
18  "pages": [
19    {
20      "name": "Homepage",
21      "slug": "/",
22      "blocks": [
23        {
24          "type": "@cmssy-marketing/blocks.hero",
25          "content": { "heading": "Build reusable UI blocks" }
26        }
27      ]
28    }
29  ]
30}
Template vs Block

Think of blocks as components and templates as compositions. Blocks are the bricks, templates are the blueprints. You develop blocks individually, then assemble them into templates.