This article walks through creating a new page from the empty state, adding sections, and arranging blocks to form a coherent layout.
Step-by-Step
- Open Architect Panel → Page Builder → Pages and click New page.
- Pick a starting point — blank, or a template (Landing page, Dashboard, Knowledge article).
- Set the page title, URL slug and visibility.
- Add sections. Each section is a container that occupies the full width — they stack vertically.
- Within a section, add blocks. Use columns to put blocks side-by-side.
- Configure each block via the inspector — text, image source, form ID, query.
- Preview as a typical user — different browser, signed-out vs signed-in.
- Publish.
Section Templates
- Hero: Large heading + sub + CTA + background image.
- Two-column: Text on one side, image on the other.
- Three-card: Three equal-width cards with icon, title, body, link.
- FAQ: Accordion list of question/answer pairs.
- CTA strip: Centered headline + button — pre-formatted for conversions.
- Gallery: Grid of images with captions.
- Embed: Iframe-wrapped external content.
Responsive Design
- Each block has visibility toggles per breakpoint — show on desktop only, on mobile only, or both.
- Columns automatically stack on narrow screens.
- Test using the device preview dropdown (Desktop, Tablet, Phone).
Worked Examples
- Landing page: Hero section with CTA, three-card features section, FAQ section, final CTA strip.
- Member portal home: Personalised hero (uses signed-in user's name), recent activity feed, account summary, quick links.
- Product info page: Hero, two-column overview, gallery, embedded video, CTA, FAQ.
- Internal team page: Two-column heading + photo, three-column “meet the team” cards, embedded calendar, embedded survey.