Page Builder: Building a Page
Page Builder: Building a Page
A page is an ordered bundle of blocks. You add blocks, reorder them, and each block owns its own content and style.
Creating a page
- Content → Pages → Create Page
- Give it a title (the slug fills itself in)
- Either add blocks one at a time, or press Start from a template to build the whole page at once
You do not have to save first — picking a template on a blank editor creates the page for you and opens it ready to edit.
Adding content
| Control | What it does |
|---|---|
| Add Block | The fast path — pick a single block type from the sidebar |
| Templates & blocks | Opens the library: whole-page templates, marketplace templates, and saved block sections |
Blocks can be dragged to reorder, duplicated, hidden, or nested inside a Layout block to build columns.
Page layout options
Under the Template tab, Page Layout decides how much site chrome the page carries:
| Option | Result |
|---|---|
| Full Layout | Header, footer, breadcrumbs — the normal storefront page |
| Minimal | A light shell, no full navigation |
| None | No header or footer — for landing and campaign pages |
An unrecognised value always falls back to the full shell, so a page can never accidentally render without chrome.
Responsive images: separate art per device
Image-backed blocks (Banner, Slider) accept a different image for desktop, tablet and mobile. Tablet and mobile are optional — leave them empty and that device uses the desktop image.
This exists because one wide hero rarely works everywhere: a landscape shot that looks right on a desktop is usually cropped badly on a phone.
Focal point: choose what stays in frame
Under each image is a focal point picker. Drag directly on the image to choose the spot that must remain visible when the block crops it, with a rule-of-thirds grid to guide you. Each device gets its own focal point.
The value is a percentage pair mapped straight onto CSS background-position, so what you pick is
exactly what renders. Leave it unset and the block falls back to its keyword position (center, top,
and so on). Press Reset to clear it.
Page style
The same tab carries background colour and image, max width, padding, fonts (body and heading, including weights), letter spacing and custom CSS — all applied to the page canvas rather than to individual blocks.