Sections and templates

Stores are composed, not generated. The library is around a hundred components with more than 350 templates between them, every one mobile-safe and every one dressed by all eight design styles.

The vocabulary

Three levels, from the merchant's point of view:

• Section — a group of components shown together in the editor's Add menu: Navigation, Product Info, Benefits & Value, Social Proof, Offers, Buttons, and so on.
• Component — one building block with several templates: a Hero, a Review Wall, an FAQ, a Buy Box, a Cross-sell Shelf.
• Template — one specific way of rendering that component. A Review Wall might be a grid, a photo rail or a single spotlight review. Templates differ in layout, content and animation; the look of a template under each design style comes from the style, not from the template.

So a store is a list of components, each with a chosen template, all rendered under one design style.

What the library covers

• Navigation — headers with mega-menus built from the collection tree, footers, breadcrumbs, a designed 404 page.
• Heroes and showcases — the opening statement, in many shapes.
• Product information — buy boxes (with variants, quantity, subscriptions, expanding detail cards), spec sheets, ingredients, comparison tables, galleries with a lightbox.
• Benefits and value — feature grids, image-with-text, how-it-works staircases, results timelines, statistics, before/after (static or interactive reveal).
• Social proof — review walls, testimonials, avatar tabs, press and trust badges.
• Offers — bundle builders, cross-sell shelves, gift ladders, subscribe-and-save, free-shipping bars, urgency.
• Catalogue — collection grids, featured products, shop-by-category tiles, filters.
• Interactive widgets — finders, calculators, configurators, where a product warrants one.
• Support — FAQ accordions, contact and policy pages, newsletter capture.

Why templates rather than free-form generation

A layout generated from scratch is unpredictable on a phone, inconsistent across pages and hard to edit. A template is tested, mobile-safe and editable, and it carries a part contract that every design style honours. Camel's job is to choose well — which components, which templates, in what order, populated with what — and that is where the persona and the product data go.

Mobile

Templates are built mobile-first. Card rows that stack awkwardly on a phone collapse into a rail instead, in one of several authored modes (a still mosaic, a one-card pager, or a slow drift), and the merchant picks the mode in the Template tab.

Motion

Sections reveal on scroll through one shared system, with a tempo set by the design style. A section that wants more (a word-by-word heading, a child cascade, a hero settle) declares it once, and the published theme carries the same motion.

Reading this with a machine? This page is also at /docs/sections-and-templates.md, and every page is indexed at /llms.txt.